/* rb-air-20260807 */
/**
 * Rainbow UI v5 — Demo full parity (My Rainbow WMS)
 * Match React demo tokens + top-nav shell + card lists
 */
:root {
  --rb-bg: #f3f3f4;
  --rb-surface: #ffffff;
  --rb-surface-2: #f9f9f9;
  --rb-ink: #676a6c;
  --rb-heading: #333333;
  --rb-muted: #888888;
  --rb-subtle: #a7b1c2;
  --rb-border: #e7eaec;
  --rb-border-strong: #ddd;
  --rb-nav: #2f4050;
  --rb-nav-hover: #293846;
  --rb-accent: #1690d8;
  --rb-accent-hover: #0f6fad;
  --rb-accent-soft: #e8f4fb;
  --rb-ok: #1ab394;
  --rb-danger: #ed5565;
  --rb-warn: #f8ac59;
  --rb-radius: 3px;
  --rb-font: "open sans", "Helvetica Neue", Helvetica, "PingFang TC", "Microsoft JhengHei", Arial, sans-serif;
}

html, body, body.gray-bg, body.pace-done, body.fixed-sidebar, body.rb-topnav {
  background: var(--rb-bg) !important;
  font-family: var(--rb-font) !important;
  color: var(--rb-ink);
  font-size: 13px;
  line-height: 1.42857143;
}
#page-wrapper, .wrapper-content, .dashbard-1 { background: var(--rb-bg) !important; }
.wrapper-content { padding: 10px 12px !important; }
.wrapper.wrapper-content.animated { animation: none !important; }

/* Hide any old version badges */
body::before { display: none !important; content: none !important; }

/* ===== TOP NAV SHELL ===== */
body.rb-topnav .navbar-static-side { display: none !important; width: 0 !important; }
body.rb-topnav #page-wrapper {
  margin: 0 !important; width: 100% !important; padding: 0 !important;
  min-height: 100vh !important; background: var(--rb-bg) !important;
}
body.rb-topnav #wrapper { overflow: hidden; }

/* Content chrome */
.ibox {
  border: 1px solid var(--rb-border) !important;
  border-radius: var(--rb-radius) !important;
  box-shadow: 0 1px 1px rgba(0,0,0,.05) !important;
  background: var(--rb-surface) !important;
  margin-bottom: 12px !important;
  overflow: hidden;
}
.ibox-title {
  border-bottom: 1px solid var(--rb-border) !important;
  background: #fff !important;
  min-height: 44px !important;
  padding: 10px 14px !important;
}
.ibox-title h5 {
  font-size: 14px !important; font-weight: 600 !important;
  color: var(--rb-heading) !important; margin: 0 !important;
}
.ibox-content { background: #fff !important; padding: 12px 14px !important; }

.form-control {
  height: 26px !important; padding: 2px 6px !important; font-size: 11px !important;
  border-radius: 2px !important; border: 1px solid var(--rb-border-strong) !important;
  box-shadow: none !important; color: var(--rb-heading) !important;
}
label, label.inline { font-size: 11px !important; color: var(--rb-ink) !important; font-weight: 400 !important; }

.btn {
  border-radius: 3px !important; font-size: 12px !important; font-weight: 400 !important;
  padding: 4px 10px !important;
}
.btn-xs { font-size: 11px !important; padding: 1px 6px !important; line-height: 1.5 !important; }
.btn-primary {
  background: var(--rb-accent) !important; border-color: var(--rb-accent) !important; color: #fff !important;
}
.btn-primary:hover, .btn-primary:focus {
  background: var(--rb-accent-hover) !important; border-color: var(--rb-accent-hover) !important;
}
.btn-primary.btn-outline {
  color: var(--rb-accent) !important; background: #fff !important;
  border-color: rgba(22,144,216,.45) !important;
}
.btn-primary.btn-outline:hover {
  color: #fff !important; background: var(--rb-accent) !important; border-color: var(--rb-accent) !important;
}
.btn-danger, .btn-danger.btn-outline {
  color: var(--rb-danger) !important; background: #fff !important;
  border-color: rgba(237,85,101,.5) !important;
}
.btn-danger:hover, .btn-danger.btn-outline:hover {
  color: #fff !important; background: var(--rb-danger) !important; border-color: var(--rb-danger) !important;
}
.hr-line-dashed {
  border-top: 1px dashed var(--rb-border) !important; margin: 10px 0 !important;
  background: transparent !important; height: 0 !important; color: transparent !important;
}

.list_user a, .list_user .btn {
  display: inline-block !important; margin: 2px 4px 2px 0 !important;
  padding: 4px 10px !important; font-size: 11px !important; font-weight: 500 !important;
  border-radius: 3px !important; border: 1px solid rgba(22,144,216,.45) !important;
  background: #fff !important; color: var(--rb-accent) !important; text-decoration: none !important;
}
.list_user a:hover { background: var(--rb-accent) !important; color: #fff !important; }

/* Content tabs under top menu — demo-like thin bar */
body.rb-topnav .content-tabs {
  background: #fff !important;
  border-bottom: 1px solid var(--rb-border) !important;
  height: 36px !important;
  margin: 0 !important;
}
body.rb-topnav .page-tabs a {
  color: var(--rb-muted) !important; font-size: 12px !important;
  line-height: 34px !important; border: 0 !important;
}
body.rb-topnav .page-tabs a.active {
  background: var(--rb-accent-soft) !important;
  color: var(--rb-accent) !important;
  border-bottom: 2px solid var(--rb-accent) !important;
}
body.rb-topnav .roll-nav {
  background: #fff !important; color: var(--rb-muted) !important;
  border: 0 !important; height: 36px !important; line-height: 36px !important;
}
body.rb-topnav .J_mainContent {
  height: calc(100vh - 50px - 40px - 36px - 28px) !important;
}
body.rb-topnav .footer {
  background: #fff !important; border-top: 1px solid var(--rb-border) !important;
  height: 28px !important; line-height: 28px !important; margin: 0 !important;
  padding: 0 12px !important; font-size: 11px !important; color: var(--rb-muted) !important;
}

/* Card list */
.rb-card-list, .rb-plan-list { display: flex; flex-direction: column; gap: 10px; }
.rb-card, .rb-plan-card {
  box-shadow: 0 1px 2px rgba(15, 35, 55, .04);
  border: 1px solid var(--rb-border);
  border-left: 3px solid var(--rb-accent);
  border-radius: var(--rb-radius);
  background: #fff;
  box-shadow: 0 1px 1px rgba(0,0,0,.04);
  overflow: hidden;
}
.rb-card.rb-danger { border-left-color: var(--rb-danger); }
.rb-card-row { display: flex; flex-wrap: wrap; align-items: stretch; }
.rb-card-main { flex: 1; min-width: 0; padding: 12px 14px; }
.rb-card-title {
  font-size: 14px; font-weight: 600; color: var(--rb-heading);
  font-family: Consolas, Menlo, monospace;
}
.rb-card-sub { font-size: 12px; color: var(--rb-muted); margin-top: 3px; line-height: 1.45; }
.rb-card-actions {
  display: flex; flex-wrap: wrap; gap: 4px; align-items: center; justify-content: flex-end;
  padding: 10px 12px; border-top: 1px solid var(--rb-border); background: #fafbfc;
}
@media (min-width: 960px) {
  .rb-card-actions {
    border-top: 0; border-left: 1px solid var(--rb-border);
    flex-direction: column; justify-content: center; min-width: 108px;
  }
}
.rb-kv {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 6px 12px; margin-top: 8px;
}
.rb-kv > div { font-size: 11px; color: var(--rb-muted); }
.rb-kv > div b {
  display: block; color: var(--rb-heading); font-size: 12px; font-weight: 600;
  margin-top: 1px; white-space: pre-wrap;
}
.rb-badge {
  display: inline-block; padding: 1px 6px; border-radius: 2px;
  font-size: 10px; font-weight: 600; background: var(--rb-surface-2);
  border: 1px solid var(--rb-border); color: var(--rb-ink);
}
.rb-badge-info { background: var(--rb-accent-soft); border-color: #b6dff5; color: var(--rb-accent); }
.rb-badge-ok { background: #e7f7f4; border-color: #b8ebe0; color: var(--rb-ok); }
.rb-empty {
  text-align: center; padding: 40px 16px; color: var(--rb-subtle);
  border: 1px dashed var(--rb-border); border-radius: 3px; background: #fafafa;
}
.rb-pre { white-space: pre-wrap; font-family: inherit; margin: 0; font-size: 11px; color: var(--rb-heading); line-height: 1.4; }

/* Plan */
.rb-plan-head {
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 16px;
  padding: 12px 14px; background: #f7f9fc; border-bottom: 1px solid var(--rb-border);
}
.rb-plan-no { font-size: 16px; font-weight: 700; color: var(--rb-heading); min-width: 56px; }
.rb-plan-meta { font-size: 12px; color: var(--rb-muted); flex: 1; min-width: 180px; }
.rb-plan-meta strong { color: var(--rb-heading); }
.rb-plan-remark { font-size: 12px; color: #374151; line-height: 1.45; max-width: 420px; }
.rb-plan-files { display: flex; flex-direction: column; gap: 2px; font-size: 11px; }
.rb-plan-actions { display: flex; flex-wrap: wrap; gap: 4px; margin-left: auto; }
.rb-plan-uld-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.rb-plan-uld-table th {
  background: #f5f5f6; color: var(--rb-muted); font-size: 10px; font-weight: 600;
  text-align: left; padding: 6px 8px; border-bottom: 1px solid var(--rb-border);
}
.rb-plan-uld-table td { padding: 8px; border-bottom: 1px solid #f0f0f0; vertical-align: top; }
.rb-plan-uld-table .mono { font-family: Consolas, Menlo, monospace; font-weight: 600; color: var(--rb-accent); }

/* ⋯ menu */
.rb-more { position: relative; display: inline-block; vertical-align: middle; }
.rb-more-menu {
  display: none; position: absolute; right: 0; top: 100%; z-index: 1000;
  min-width: 148px; margin-top: 2px; padding: 4px 0; background: #fff;
  border: 1px solid var(--rb-border); border-radius: 3px; box-shadow: 0 8px 20px rgba(0,0,0,.12);
}
.rb-more.open .rb-more-menu { display: block; }
.rb-more-menu a {
  display: block; padding: 7px 12px; font-size: 11px;
  color: var(--rb-heading) !important; text-decoration: none !important;
}
.rb-more-menu a:hover { background: var(--rb-surface-2); color: var(--rb-accent) !important; }

/* Tables still used on secondary pages */
.table-bordered { border-color: var(--rb-border) !important; }
.table-bordered > thead > tr > th {
  background: #f5f5f6 !important; color: var(--rb-muted) !important;
  font-size: 11px !important; font-weight: 600 !important; border-color: var(--rb-border) !important;
}
.table-bordered > tbody > tr > td {
  border-color: var(--rb-border) !important; font-size: 12px !important; vertical-align: top !important;
}
.table-bordered > tbody > tr.main-data > td {
  background: #f9f9f9 !important; border-left: 3px solid var(--rb-accent);
}
.option-btn-group { position: static !important; white-space: normal !important; }
.table-responsive, .example, .example-wrap { overflow: visible !important; }
.strikethrough-red, tr.strikethrough-red td {
  color: var(--rb-danger) !important; text-decoration: line-through;
}
.spiner-example { background: rgba(243,243,244,.7) !important; }

/* Login page if present */
body.signin { background: var(--rb-bg) !important; }

@media (max-width: 768px) {
  .wrapper-content { padding: 8px !important; }
  .ibox-content { padding: 10px !important; }
}


/* ===== v5.1 Demo registration cards (pixel-closer) ===== */
.rb-card-list { gap: 8px !important; }
.rb-card {
  border-left: 0 !important;
  border-radius: 3px !important;
}
.rb-card-demo {
  border: 1px solid #e7eaec;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  overflow: hidden;
}
.rb-card-demo-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  border-left: 4px solid #1690d8;
}
.rb-card-demo-main {
  flex: 1;
  min-width: 0;
  padding: 10px 12px;
}
.rb-card-demo-line1 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.rb-so {
  font-family: Consolas, Menlo, monospace;
  font-size: 13px;
  font-weight: 600;
  color: #1690d8;
}
.rb-chip {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 2px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.4;
  border: 1px solid #e7eaec;
  background: #f5f5f6;
  color: #676a6c;
  text-transform: uppercase;
}
.rb-chip-air { background: #e6fafb; border-color: #b8e8ea; color: #1a9a9c; }
.rb-chip-sea { background: #e7f7f4; border-color: #b8ebe0; color: #1ab394; }
.rb-chip-port { background: #fff; }
.rb-user-name { font-size: 12px; font-weight: 600; color: #333; }
.rb-card-demo-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 14px;
  margin-top: 6px;
  font-size: 11px;
  color: #888;
}
.rb-card-demo-meta strong {
  color: #333;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.rb-card-demo-charges {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}
.rb-charge {
  display: inline-block;
  padding: 2px 6px;
  border-radius: 2px;
  font-size: 10px;
  border: 1px solid #e7eaec;
  background: #f9f9f9;
  color: #333;
}
.rb-charge.is-zero {
  border-color: transparent;
  background: transparent;
  color: #a7b1c2;
}
.rb-charge-sum {
  background: #e8f4fb;
  border-color: #b6dff5;
  color: #1690d8;
  font-weight: 700;
}
/* old rb-card-demo-acts horizontal block removed — see rail styles below */

.rb-act-primary {
  display: inline-flex !important;
  align-items: center;
  gap: 2px;
  height: 26px !important;
  padding: 0 8px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  border-radius: 3px !important;
  background: #1690d8 !important;
  border: 1px solid #1690d8 !important;
  color: #fff !important;
}
.rb-act-primary:hover { background: #0f6fad !important; border-color: #0f6fad !important; color: #fff !important; }
.rb-act-outline {
  display: inline-flex !important;
  align-items: center;
  gap: 2px;
  height: 26px !important;
  padding: 0 8px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  border-radius: 3px !important;
  background: #fff !important;
  border: 1px solid rgba(22,144,216,.4) !important;
  color: #1690d8 !important;
}
.rb-act-outline:hover { background: #1690d8 !important; color: #fff !important; }
.rb-act-ghost {
  display: inline-flex !important;
  align-items: center;
  height: 26px !important;
  padding: 0 8px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  border-radius: 3px !important;
  background: #fff !important;
  border: 1px solid #e7eaec !important;
  color: #676a6c !important;
}
.rb-act-receipt-on {
  background: #e8f8f4 !important;
  border-color: #1ab394 !important;
  color: #1ab394 !important;
}
.rb-filterbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}
.rb-filterbar .rb-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px;
}
.rb-filterbar label {
  display: block;
  font-size: 11px !important;
  color: #888 !important;
  margin: 0 !important;
}
.rb-filterbar .form-control {
  margin-top: 2px;
  width: auto !important;
  display: inline-block;
}


/* ===== Plan List layout = Demo (v5.7) ===== */
.rb-plan-list { display: flex; flex-direction: column; gap: 10px; }
.rb-plan-card {
  border: 1px solid #e7eaec !important;
  border-radius: 3px !important;
  border-left: 0 !important;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  overflow: hidden;
}
.rb-plan-top {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  border-left: 3px solid #2f4050;
}
.rb-plan-body {
  flex: 1;
  min-width: 0;
  padding: 10px 12px;
}
.rb-plan-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.rb-plan-no {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #333 !important;
  min-width: auto !important;
}
.rb-plan-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 14px;
  margin-top: 4px;
  font-size: 11px;
  color: #888;
}
.rb-plan-meta-row .v { color: #333; font-weight: 600; }
.rb-plan-meta-row .lab { color: #a7b1c2; }
.rb-plan-remark {
  margin: 6px 0 0 !important;
  font-size: 11px !important;
  line-height: 1.45 !important;
  color: rgba(51,51,51,.85) !important;
  max-width: none !important;
}
.rb-plan-files {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  margin-top: 8px;
  min-width: 0 !important;
  max-width: none !important;
}
.rb-plan-side {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  padding: 10px 12px;
  border-top: 1px solid #e7eaec;
  background: #fafbfc;
}
/* 手機：操作鈕直向，不要橫排擠成一排 */
@media (max-width: 899px) {
  .rb-plan-side {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
    gap: 6px !important;
    padding: 10px 12px 12px !important;
  }
  .rb-plan-side .rb-act-primary,
  .rb-plan-side .rb-act-outline,
  .rb-plan-side .rb-act-danger,
  .rb-plan-side > a {
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    height: 36px !important;
    min-height: 36px !important;
  }
}
@media (min-width: 900px) {
  .rb-plan-side {
    border-top: 0;
    border-left: 1px solid #e7eaec;
    flex-direction: column;
    justify-content: center;
    min-width: 108px;
  }
  .rb-plan-side .rb-act-primary,
  .rb-plan-side .rb-act-outline,
  .rb-plan-side .rb-act-danger {
    width: 100%;
    justify-content: center !important;
  }
}
.rb-plan-ulds {
  border-top: 1px solid #e7eaec;
  background: #fafbfc;
  overflow-x: auto;
}
.rb-plan-uld-table {
  width: 100%;
  min-width: 900px;
  border-collapse: collapse;
  font-size: 11px;
  text-align: left;
}
.rb-plan-uld-table thead th {
  background: transparent !important;
  color: #888 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: 6px 8px !important;
  border-bottom: 1px solid #e7eaec !important;
}
.rb-plan-uld-table tbody td {
  padding: 8px !important;
  border-bottom: 1px solid rgba(231,234,236,.8) !important;
  vertical-align: top !important;
  background: transparent;
}
.rb-plan-uld-table tbody tr:nth-child(even) td { background: #f6f8fa !important; }
.rb-plan-uld-table tbody tr:hover td { background: #fff !important; }
.rb-plan-uld-table .mono {
  font-family: Consolas, Menlo, monospace;
  font-weight: 600;
  color: #333;
}
.rb-plan-uld-table .so-link {
  font-family: Consolas, Menlo, monospace;
  font-weight: 600;
  color: #1690d8;
}
.rb-plan-empty {
  padding: 10px 14px;
  font-size: 11px;
  color: #a7b1c2;
}
/* Plan No. 導航條（與 user chip 同系風格） */
.rb-plan-nav {
  display: none;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 10px 0 0;
  padding: 8px 10px;
  background: #f5f7fa;
  border: 1px solid #e7eaec;
  border-radius: 3px;
}
.rb-plan-nav.is-on { display: flex; }
.rb-plan-nav-lab {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 10px;
  font-weight: 700;
  color: #a7b1c2;
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-right: 4px;
  white-space: nowrap;
}
.rb-plan-nav-lab i { color: #1690d8; font-size: 11px; }
.rb-plan-nav a.rb-plan-nav-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 26px;
  padding: 0 10px;
  border: 1px solid rgba(22, 144, 216, .35);
  border-radius: 3px;
  background: #fff;
  color: #1690d8;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none !important;
  cursor: pointer;
  font-family: Consolas, Menlo, monospace;
  line-height: 24px;
  transition: background .12s, border-color .12s, color .12s, box-shadow .12s;
}
.rb-plan-nav a.rb-plan-nav-item:hover {
  border-color: #1690d8;
  background: #e8f4fb;
  color: #0d7ab8;
  box-shadow: 0 1px 2px rgba(22, 144, 216, .12);
}
.rb-plan-nav a.rb-plan-nav-item.is-on {
  border-color: #1690d8;
  background: #1690d8;
  color: #fff;
  box-shadow: 0 1px 3px rgba(22, 144, 216, .28);
}
.rb-plan-nav-count {
  margin-left: auto;
  font-size: 10px;
  font-weight: 600;
  color: #a7b1c2;
  white-space: nowrap;
}
.rb-plan-card.rb-plan-flash {
  outline: 2px solid #1690d8;
  box-shadow: 0 0 0 4px rgba(22, 144, 216, .16);
}
  background: #fafbfc;
  border-top: 1px solid #e7eaec;
}
.rb-file-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 220px;
  padding: 2px 7px;
  border-radius: 3px;
  font-size: 10px;
  line-height: 1.4;
  text-decoration: none !important;
  border: 1px solid transparent;
}
.rb-file-chip span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rb-file-chip.pdf { color: #d9534f !important; background: #fdecee; border-color: #f5c6cb; }
.rb-file-chip.xls { color: #3c763d !important; background: #dff0d8; border-color: #c3e6cb; }
.rb-file-chip.img { color: #1ab394 !important; background: #e7f7f4; border-color: #b8ebe0; }
.rb-file-chip.other { color: #676a6c !important; background: #f5f5f6; border-color: #e7eaec; }
.rb-chip-uld {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 2px;
  font-size: 10px;
  font-weight: 700;
  background: #e8f4fb;
  color: #1690d8;
}
.rb-chip-nould {
  display: inline-block;
  padding: 1px 7px;
  border-radius: 2px;
  font-size: 10px;
  background: #f5f5f6;
  color: #888;
}


/* ===== Air Inbound demo layout ===== */
.rb-ib-card {
  border: 1px solid #e7eaec;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  overflow: hidden;
}
.rb-ib-top {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  border-left: 4px solid #1690d8;
}
.rb-ib-main { flex: 1; min-width: 0; padding: 10px 12px; }
.rb-ib-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
}
.rb-ib-hawb-lab {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #888;
}
.rb-ib-hawb {
  font-family: Consolas, Menlo, monospace;
  font-size: 13px;
  font-weight: 700;
  color: #1690d8;
}
.rb-ib-so-tag {
  font-size: 10px;
  color: #a7b1c2;
}
.rb-ib-user {
  font-size: 12px;
  font-weight: 600;
  color: #333;
}
.rb-ib-date {
  font-size: 11px;
  color: #888;
}
.rb-ib-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 6px 16px;
  margin-top: 8px;
  font-size: 11px;
  color: #888;
}
.rb-ib-meta .k { color: #a7b1c2; margin-right: 3px; }
.rb-ib-meta .v {
  color: #333;
  font-weight: 600;
  font-family: Consolas, Menlo, monospace;
  font-size: 11px;
}
.rb-ib-meta .v.plain { font-family: inherit; font-weight: 500; }
.rb-ib-meta .dim {
  white-space: pre-line;
  font-family: Consolas, Menlo, monospace;
  font-size: 10px;
  font-weight: 500;
  color: #333;
  line-height: 1.35;
}
.rb-ib-term {
  width: 64px;
  border: 1px solid #e7eaec;
  border-radius: 3px;
  padding: 2px 4px;
  font-size: 11px;
  text-align: center;
}
.rb-ib-term:focus {
  border-color: #1690d8;
  outline: none;
}
.rb-ib-side {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  padding: 10px 12px;
  border-top: 1px solid #e7eaec;
  background: #fafbfc;
}
@media (min-width: 900px) {
  .rb-ib-side {
    border-top: 0;
    border-left: 1px solid #e7eaec;
    flex-direction: column;
    justify-content: center;
    min-width: 100px;
  }
  .rb-ib-side .rb-act-primary,
  .rb-ib-side .rb-act-outline,
  .rb-ib-side .rb-act-danger,
  .rb-ib-side .rb-act-ghost {
    width: 100%;
    justify-content: center !important;
  }
}
.rb-ib-child {
  border-top: 1px dashed #e7eaec;
  background: #fafbfc;
  padding: 8px 12px 8px 28px;
  font-size: 11px;
}
.rb-ib-child-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  padding: 4px 0;
}
.rb-ib-child-row .mark { color: #a7b1c2; }


/* ===== Air Inbound dense cards v59 ===== */
.rb-ib2 {
  border: 1px solid #e7eaec;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  overflow: hidden;
  border-left: 4px solid #1690d8;
}
.rb-ib2-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}
.rb-ib2-main {
  flex: 1;
  min-width: 220px;
  padding: 10px 12px;
}
.rb-ib2-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
}
.rb-ib2-hawb {
  font-family: Consolas, Menlo, monospace;
  font-size: 14px;
  font-weight: 700;
  color: #1690d8;
}
.rb-ib2-user {
  font-size: 12px;
  font-weight: 700;
  color: #333;
}
.rb-ib2-date {
  font-size: 11px;
  color: #a7b1c2;
  margin-left: auto;
}
.rb-ib2-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.rb-ib2-m {
  display: inline-flex;
  flex-direction: column;
  min-width: 64px;
  padding: 5px 8px;
  border-radius: 3px;
  background: #f7f9fc;
  border: 1px solid #eef1f4;
}
.rb-ib2-m .lab {
  font-size: 9px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #a7b1c2;
  line-height: 1.2;
}
.rb-ib2-m .val {
  margin-top: 2px;
  font-size: 12px;
  font-weight: 700;
  color: #333;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.rb-ib2-m .val.mono {
  font-family: Consolas, Menlo, monospace;
  font-size: 11px;
}
.rb-ib2-m.is-empty {
  opacity: .45;
}
.rb-ib2-m.is-accent {
  background: #e8f4fb;
  border-color: #b6dff5;
}
.rb-ib2-m.is-accent .val { color: #1690d8; }
.rb-ib2-vol {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}
.rb-ib2-vol span {
  font-size: 10px;
  padding: 1px 6px;
  border-radius: 10px;
  background: #f5f5f6;
  color: #676a6c;
  border: 1px solid #e7eaec;
}
.rb-ib2-notes {
  margin-top: 6px;
  font-size: 11px;
  color: #676a6c;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.rb-ib2-notes b {
  color: #a7b1c2;
  font-weight: 600;
  margin-right: 4px;
}
.rb-ib2-side {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  padding: 8px 10px;
  border-top: 1px solid #eef1f4;
  background: #fafbfc;
  min-width: 0;
}
@media (min-width: 960px) {
  .rb-ib2-side {
    flex-direction: column;
    border-top: 0;
    border-left: 1px solid #eef1f4;
    min-width: 96px;
    justify-content: center;
  }
}
.rb-ib2-side a,
.rb-ib2-side .rb-act-primary,
.rb-ib2-side .rb-act-outline,
.rb-ib2-side .rb-act-danger,
.rb-ib2-side .rb-act-ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 56px;
  height: 26px !important;
  padding: 0 8px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-sizing: border-box;
}
.rb-ib2-child {
  border-top: 1px dashed #e7eaec;
  background: #fafbfc;
  padding: 6px 12px 6px 16px;
}
.rb-ib2-child-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  align-items: center;
  padding: 3px 0;
  font-size: 11px;
  color: #676a6c;
}
.rb-ib2-child-row .hawb {
  font-family: Consolas, Menlo, monospace;
  font-weight: 700;
  color: #1690d8;
}


/* ===== Air Inbound roomy cards v60 (based on live screenshot, more air) ===== */
.rb-card-list { gap: 12px !important; }

.rb-ib3 {
  border: 1px solid #e7eaec;
  border-radius: 4px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  overflow: hidden;
}
.rb-ib3-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0;
}
@media (max-width: 720px) {
  .rb-ib3-grid { grid-template-columns: 1fr; }
}
.rb-ib3-main {
  padding: 14px 16px 12px;
  min-width: 0;
}
.rb-ib3-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid #f0f2f4;
}
.rb-ib3-hawb {
  font-family: Consolas, Menlo, monospace;
  font-size: 15px;
  font-weight: 700;
  color: #1690d8;
  letter-spacing: -0.02em;
}
.rb-ib3-user {
  font-size: 13px;
  font-weight: 700;
  color: #333;
}
.rb-ib3-date {
  margin-left: auto;
  font-size: 11px;
  color: #a7b1c2;
  font-variant-numeric: tabular-nums;
}
.rb-ib3-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}
.rb-ib3-m {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 72px;
  min-height: 48px;
  padding: 8px 12px;
  border-radius: 4px;
  background: #f7f9fc;
  border: 1px solid #e8ecf0;
}
.rb-ib3-m.dest {
  background: #e8f4fb;
  border-color: #c5e4f6;
}
.rb-ib3-m.dest .val { color: #1690d8; }
.rb-ib3-m .lab {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #a7b1c2;
  margin-bottom: 4px;
}
.rb-ib3-m .val {
  font-size: 13px;
  font-weight: 700;
  color: #333;
  font-variant-numeric: tabular-nums;
  line-height: 1.25;
  word-break: break-all;
}
.rb-ib3-m .val.mono {
  font-family: Consolas, Menlo, monospace;
  font-size: 12px;
}
.rb-ib3-m.loc {
  min-width: 100px;
  max-width: 200px;
}
.rb-ib3-m.loc .val {
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rb-ib3-term-input {
  width: 64px;
  border: 1px solid #d0d7de;
  border-radius: 3px;
  padding: 3px 6px;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  background: #fff;
  color: #1690d8;
}
.rb-ib3-term-input:focus {
  border-color: #1690d8;
  outline: none;
  box-shadow: 0 0 0 2px rgba(22,144,216,.15);
}
.rb-ib3-vol {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}
.rb-ib3-vol span {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 500;
  color: #555;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  white-space: nowrap;
}
.rb-ib3-note {
  font-size: 12px;
  line-height: 1.5;
  color: #676a6c;
  padding: 8px 10px;
  background: #fafbfc;
  border-radius: 3px;
  border-left: 3px solid #e7eaec;
}
.rb-ib3-note b {
  color: #a7b1c2;
  font-weight: 600;
  margin-right: 6px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.rb-ib3-side {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  padding: 14px 12px;
  background: #fafbfc;
  border-left: 1px solid #eef1f4;
  min-width: 92px;
}
@media (max-width: 720px) {
  .rb-ib3-side {
    flex-direction: row;
    flex-wrap: wrap;
    border-left: 0;
    border-top: 1px solid #eef1f4;
    justify-content: flex-end;
  }
}
.rb-ib3-side a,
.rb-ib3-side .rb-act-primary,
.rb-ib3-side .rb-act-outline,
.rb-ib3-side .rb-act-danger,
.rb-ib3-side .rb-act-ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100%;
  min-height: 28px !important;
  height: auto !important;
  padding: 5px 10px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-sizing: border-box;
}
@media (max-width: 720px) {
  .rb-ib3-side a,
  .rb-ib3-side .rb-act-primary,
  .rb-ib3-side .rb-act-outline,
  .rb-ib3-side .rb-act-danger,
  .rb-ib3-side .rb-act-ghost {
    width: auto;
    min-width: 64px;
  }
}
.rb-ib3-child {
  border-top: 1px dashed #e7eaec;
  background: #f9fafb;
  padding: 8px 16px 8px 20px;
}
.rb-ib3-child-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  align-items: center;
  padding: 4px 0;
  font-size: 12px;
  color: #676a6c;
}
.rb-ib3-child-row .hawb {
  font-family: Consolas, Menlo, monospace;
  font-weight: 700;
  color: #1690d8;
}


/* ===== Air Inbound preferred layout v61 (user screenshot style) ===== */
.rb-card-list { gap: 10px !important; }

.rb-ib4 {
  border: 1px solid #e7eaec;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 1px 1px rgba(0,0,0,.03);
  overflow: hidden;
  border-left: 3px solid #1690d8;
}
.rb-ib4-row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}
.rb-ib4-main {
  flex: 1;
  min-width: 0;
  padding: 12px 14px;
}
.rb-ib4-head {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center !important;
  gap: 8px 10px;
  margin-bottom: 8px;
}
.rb-ib4-head .rb-ib4-date {
  margin-left: 0;
  font-size: 11px;
  color: #a7b1c2;
}
.rb-ib4-head .rb-title-acts {
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
}
.rb-ib4-hawb {
  font-family: Consolas, Menlo, monospace;
  font-size: 14px;
  font-weight: 700;
  color: #1690d8;
}
.rb-ib4-user {
  font-size: 13px;
  font-weight: 700;
  color: #333;
}
.rb-ib4-date {
  margin-left: auto;
  font-size: 11px;
  color: #a7b1c2;
}
.rb-ib4-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.rb-ib4-m {
  display: inline-flex;
  flex-direction: column;
  padding: 6px 10px;
  min-width: 70px;
  border-radius: 3px;
  background: #f7f9fc;
  border: 1px solid #e8ecf0;
}
.rb-ib4-m.dest {
  background: #e8f4fb;
  border-color: #c5e4f6;
}
.rb-ib4-m.dest .val { color: #1690d8; }
.rb-ib4-m.term {
  background: #e8f4fb;
  border-color: #c5e4f6;
}
.rb-ib4-m .lab {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: #a7b1c2;
  margin-bottom: 3px;
}
.rb-ib4-m .val {
  font-size: 12px;
  font-weight: 700;
  color: #333;
  font-variant-numeric: tabular-nums;
  line-height: 1.3;
}
.rb-ib4-m .val.mono {
  font-family: Consolas, Menlo, monospace;
  font-size: 11px;
}
.rb-ib4-term {
  width: 58px;
  border: 1px solid #c5e4f6;
  border-radius: 2px;
  padding: 2px 4px;
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  color: #1690d8;
  background: #fff;
}
.rb-ib4-term:focus {
  outline: none;
  border-color: #1690d8;
}
.rb-ib4-vol {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 6px;
}
.rb-ib4-vol span {
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 10px;
  background: #f3f4f6;
  border: 1px solid #e5e7eb;
  color: #555;
  white-space: nowrap;
}
.rb-ib4-note {
  font-size: 11px;
  color: #888;
  line-height: 1.4;
}
.rb-ib4-note b {
  font-weight: 600;
  color: #a7b1c2;
  margin-right: 4px;
}
.rb-ib4-side {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  flex: 0 0 118px !important;
  width: 118px !important;
  min-width: 118px !important;
  max-width: 118px !important;
  padding: 10px 8px !important;
  background: linear-gradient(180deg, #fafbfc 0%, #f4f6f9 100%) !important;
  border-left: 1px solid #eef1f4 !important;
  box-sizing: border-box !important;
}
@media (max-width: 720px) {
  .rb-ib4-side {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    border-left: 0 !important;
    border-top: 1px solid #eef1f4 !important;
  }
  .rb-ib4-side a { width: auto !important; flex: 1 1 calc(50% - 4px) !important; min-width: 70px; }
}
.rb-ib4-side a,
.rb-ib4-side .rb-act-primary,
.rb-ib4-side .rb-act-outline,
.rb-ib4-side .rb-act-danger,
.rb-ib4-side .rb-act-ghost,
.rb-ib4-side .rb-act-soft {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: 100% !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 8px !important;
  margin: 0 !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  background: #fff !important;
  border: 1px solid #d5dbe3 !important;
  color: #2f4050 !important;
}
.rb-ib4-side a:hover {
  border-color: #1690d8 !important;
  color: #1690d8 !important;
  background: #f0f8fd !important;
}
.rb-ib4-side a.rb-act-on,
.rb-ib4-side a.rb-act-receipt-on {
  background: #e8f8f4 !important;
  border-color: #1ab394 !important;
  color: #1ab394 !important;
}
.rb-ib4-side a i.fa {
  width: 14px;
  text-align: center;
  font-size: 12px;
}
.rb-ib4-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
}
@media (max-width: 720px) {
  .rb-ib4-row { flex-wrap: wrap !important; }
}
.rb-ib4-child-acts {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
/* ===== Split S/O child — polish + Edit/Del same as father header ===== */
.rb-ib4-child {
  position: relative;
  margin: 0;
  padding: 12px 12px 14px 22px;
  border-top: 1px dashed rgba(22,144,216,.32);
  background: linear-gradient(180deg, #f5fafd 0%, #eef6fb 100%);
}
.rb-ib4-child::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 4px;
  bottom: 16px;
  width: 0;
  border-left: 2px dashed rgba(22,144,216,.4);
}
.rb-ib4-child-card {
  position: relative;
  margin-top: 10px;
  border: 1px solid rgba(22,144,216,.26);
  border-left: 3px solid #1690d8;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(22,144,216,.07);
  transition: box-shadow .15s, border-color .15s;
}
.rb-ib4-child-card:first-child { margin-top: 0; }
.rb-ib4-child-card:hover {
  box-shadow: 0 2px 10px rgba(22,144,216,.12);
  border-color: rgba(22,144,216,.4);
}
.rb-ib4-child-card::before {
  content: "";
  position: absolute;
  left: -18px;
  top: 16px;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 2px solid #1690d8;
  background: #fff;
  box-shadow: 0 0 0 3px #eef6fb;
  z-index: 1;
}
.rb-ib4-child-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  padding: 8px 12px;
  background: linear-gradient(180deg, #f0f8fd 0%, #e8f4fb 100%);
  border-bottom: 1px solid rgba(22,144,216,.14);
}
.rb-split-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  border-radius: 4px;
  background: #1690d8;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  box-shadow: 0 1px 2px rgba(22,144,216,.25);
}
.rb-split-tag i.fa {
  font-family: FontAwesome !important;
  font-style: normal !important;
  font-size: 11px;
}
.rb-split-from {
  font-size: 11px;
  color: #8a94a6;
}
.rb-split-from b {
  color: #1690d8;
  font-family: Consolas, Menlo, monospace;
  font-weight: 700;
}
.rb-split-date {
  font-size: 11px;
  color: #a7b1c2;
  font-variant-numeric: tabular-nums;
}
/* Edit / Del — same rb-ico-btn as father .rb-title-acts */
.rb-child-title-acts {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
}
.rb-ib4-child-head .hawb.mono {
  font-family: Consolas, Menlo, monospace;
  font-weight: 700;
  font-size: 12px;
  color: #2f4050;
  padding: 2px 8px;
  border-radius: 3px;
  background: rgba(255,255,255,.75);
  border: 1px solid rgba(22,144,216,.15);
}
.rb-ib4-child-row-main {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
}
.rb-ib4-child-row-main .rb-ib4-main {
  flex: 1;
  min-width: 0;
  padding: 12px 14px 14px;
}
.rb-ib4-child-row-main .rb-ib4-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(100px, 140px);
  gap: 10px 12px;
  align-items: start;
}
.rb-ib4-child-row-main .rb-ib4-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.rb-ib4-child-row-main .rb-ib4-m {
  min-width: 72px;
}
.rb-ib4-child-row-main .rb-ib4-side {
  width: 118px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px 8px;
  border-left: 1px solid rgba(22,144,216,.12);
  background: linear-gradient(180deg, #fafbfc 0%, #f3f6f9 100%);
}
.rb-ib4-child-row-main .rb-ib4-side .rb-act-soft {
  width: 100%;
  min-height: 30px;
  justify-content: flex-start !important;
}
.rb-ib4-child-row-main .rb-act-both {
  border-color: rgba(22,144,216,.45) !important;
  background: #e8f4fb !important;
  color: #1690d8 !important;
  font-weight: 700 !important;
}
.rb-ib4-child-row-main .rb-act-both:hover {
  background: #1690d8 !important;
  color: #fff !important;
}
@media (max-width: 900px) {
  .rb-ib4-child-row-main .rb-ib4-body { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .rb-ib4-child-row-main { flex-wrap: wrap !important; }
  .rb-ib4-child-row-main .rb-ib4-side {
    width: 100%;
    border-left: 0;
    border-top: 1px solid rgba(22,144,216,.12);
    flex-direction: row;
    flex-wrap: wrap;
  }
  .rb-ib4-child-row-main .rb-ib4-side .rb-act-soft {
    width: auto;
    flex: 1 1 110px;
  }
  .rb-ib4-child::before,
  .rb-ib4-child-card::before { display: none; }
  .rb-ib4-child { padding-left: 10px; }
  .rb-child-title-acts { margin-left: 0; }
}

/* ===== Inbound note on the right (v62) ===== */
.rb-ib4-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(100px, 148px);
  gap: 12px 12px;
  align-items: start;
}
@media (max-width: 900px) {
  .rb-ib4-body { grid-template-columns: 1fr; }
}
.rb-ib4-left { min-width: 0; }
.rb-ib4-note-panel {
  min-width: 0;
  max-width: 148px;
  font-size: 11px;
  line-height: 1.45;
  color: #676a6c;
  padding: 8px 10px;
  background: #fafbfc;
  border: 1px solid #eef1f4;
  border-radius: 3px;
  border-left: 3px solid #c5e4f6;
  max-height: 120px;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}
.rb-ib4-note-panel .lab {
  display: block;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: #a7b1c2;
  margin-bottom: 4px;
}
.rb-ib4-note-panel.empty {
  color: #c5c9ce;
  border-left-color: #e7eaec;
  background: #fcfcfd;
}

.rb-ib4-m.vol-cube {
  background: #f3f8fb;
  border-color: #d6e8f3;
  min-width: 64px;
}
.rb-ib4-m.vol-cube .val {
  color: #2c5f7c;
  font-variant-numeric: tabular-nums;
}

.rb-ib4-m.so-cube {
  background: #e8f4fb;
  border-color: #b6dff5;
  min-width: 110px;
}
.rb-ib4-m.so-cube .val {
  color: #1690d8;
  font-weight: 700;
}

/* ===== S/O hero — most important field on Air Inbound ===== */
.rb-ib4-so-hero {
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin: 2px 0 10px;
  padding: 10px 14px 11px;
  border-radius: 6px;
  background: linear-gradient(135deg, #dff0fb 0%, #eef7fc 48%, #ffffff 100%);
  border: 1px solid #a8d6f2;
  border-left: 5px solid #1690d8;
  box-shadow: 0 1px 3px rgba(22, 144, 216, .1);
  min-width: 0;
}
.rb-ib4-so-lab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #1690d8;
  line-height: 1;
}
.rb-ib4-so-lab .tag {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .04em;
  color: #fff;
  background: #1690d8;
}
.rb-ib4-so-val {
  font-family: Consolas, Menlo, "SF Mono", monospace;
  font-size: 17px;
  font-weight: 800;
  color: #0b5f96;
  letter-spacing: .015em;
  word-break: break-all;
  line-height: 1.3;
  user-select: all;
}
.rb-ib4-so-val.is-empty {
  color: #a7b1c2;
  font-weight: 600;
  font-size: 14px;
}
/* child / split: slightly smaller but still hero */
.rb-ib4-child-row-main .rb-ib4-so-hero {
  padding: 8px 12px;
  margin-bottom: 8px;
}
.rb-ib4-child-row-main .rb-ib4-so-val {
  font-size: 15px;
}
@media (max-width: 520px) {
  .rb-ib4-so-val { font-size: 15px; }
}

/* ULD HKLA / CTO marks (old WMS parity) */
.rb-plan-mark {
  min-width: 120px;
  max-width: 180px;
  vertical-align: middle !important;
}
.rb-uld-mark {
  display: inline-block;
  max-width: 100%;
  padding: 3px 8px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: .02em;
  word-break: break-word;
  border: 1px solid transparent;
}
.rb-uld-mark.ok {
  color: #1a7f37;
  background: #dafbe1;
  border-color: #b4e6c0;
}
.rb-uld-mark.warn {
  color: #9a6700;
  background: #fff8c5;
  border-color: #f0d78c;
}
.rb-uld-mark.info {
  color: #0969da;
  background: #ddf4ff;
  border-color: #b6e3ff;
}


/* ⋯ more menu — fixed mode (not clipped by card overflow) */
.rb-more-menu.rb-more-fixed {
  display: block !important;
  position: fixed !important;
  min-width: 150px;
  background: #fff;
  border: 1px solid #e7eaec;
  box-shadow: 0 8px 24px rgba(0,0,0,.14);
  border-radius: 3px;
  padding: 4px 0;
  z-index: 99999 !important;
}
.rb-more-menu.rb-more-fixed a {
  display: block;
  padding: 8px 14px;
  font-size: 12px;
  color: #333 !important;
  text-decoration: none !important;
  white-space: nowrap;
}
.rb-more-menu.rb-more-fixed a:hover {
  background: #f5f7fa;
  color: #1690d8 !important;
}

/* allow action columns to not clip (fallback) */
.rb-ib4-side,
.rb-card-demo-acts,
.rb-plan-side {
  overflow: visible !important;
}
.rb-ib4-row,
.rb-card-demo-inner {
  overflow: visible !important;
}

/* Pickup list demo layout */
.rb-pickup-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(140px, 32%);
  gap: 8px 16px;
  margin-top: 8px;
  align-items: start;
}
@media (max-width: 720px) {
  .rb-pickup-body { grid-template-columns: 1fr; }
}
.rb-pickup-sos { min-width: 0; }
.rb-pickup-so-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 2px 0;
  font-size: 12px;
}
.rb-pickup-so-row .so {
  font-family: Consolas, Menlo, monospace;
  font-weight: 700;
  color: #1690d8;
}
.rb-pickup-so-row .pcs {
  color: #676a6c;
  font-variant-numeric: tabular-nums;
}
.rb-pickup-total {
  margin-top: 4px;
  font-size: 11px;
  color: #a7b1c2;
}
.rb-pickup-sideinfo {
  font-size: 11px;
  color: #676a6c;
  line-height: 1.55;
  text-align: right;
}
@media (max-width: 720px) {
  .rb-pickup-sideinfo { text-align: left; }
}
.rb-pickup-sideinfo strong { color: #333; font-weight: 600; }
.rb-chip-pick-ok {
  background: #dafbe1 !important;
  color: #1a7f37 !important;
  border-color: #b4e6c0 !important;
}
.rb-chip-pick-wait {
  background: #fff8c5 !important;
  color: #9a6700 !important;
  border-color: #f0d78c !important;
}

/* Generic list rows (Users / Truck Account) */
.rb-list-toolbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-bottom: 12px;
}
.rb-list-toolbar .form-control { height: 30px; font-size: 12px; }
.rb-list-row {
  display: flex; flex-wrap: wrap; align-items: stretch; gap: 0;
  background: #fff; border: 1px solid #e7eaec; border-radius: 4px;
  border-left: 4px solid #1690d8; margin-bottom: 8px;
  box-shadow: 0 1px 2px rgba(0,0,0,.04); overflow: hidden;
}
.rb-list-row-main { flex: 1; min-width: 0; padding: 10px 12px; }
.rb-list-row-title {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 6px;
}
.rb-list-row-title .name {
  font-size: 14px; font-weight: 700; color: #2f4050;
}
.rb-list-meta {
  display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 11px; color: #676a6c;
}
.rb-list-meta strong { color: #333; font-weight: 600; }
.rb-list-row-acts {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px;
  padding: 8px 10px; border-left: 1px solid #eef1f4; background: #fafbfc;
}
@media (max-width: 720px) {
  .rb-list-row-acts { border-left: 0; border-top: 1px solid #eef1f4; width: 100%; }
}
.rb-chip-type-user { background: #e8f4fc !important; color: #1690d8 !important; border-color: #b6dff5 !important; }
.rb-chip-type-op { background: #fff8c5 !important; color: #9a6700 !important; border-color: #f0d78c !important; }
.rb-chip-type-admin { background: #f3e8ff !important; color: #6e40c9 !important; border-color: #d8b9ff !important; }
.rb-chip-status-on { background: #dafbe1 !important; color: #1a7f37 !important; border-color: #b4e6c0 !important; }
.rb-chip-status-off { background: #f6f8fa !important; color: #656d76 !important; border-color: #d0d7de !important; }

/* Form pages (Add/Edit Tally, Edit Sea, etc.) */
.rb-form-demo { max-width: 920px; margin: 0 auto; }
.rb-form-demo .rb-to-card { background:#fff; border:1px solid #e7eaec; border-radius:4px; box-shadow:0 1px 2px rgba(0,0,0,.04); margin-bottom:12px; overflow:hidden; }
.rb-form-demo .rb-to-card-h { padding:10px 14px; border-bottom:1px solid #eef1f4; font-size:13px; font-weight:700; color:#2f4050; background:#fafbfc; }
.rb-form-demo .rb-to-card-b { padding:14px 16px; }
.rb-form-demo .rb-fg { display:grid; grid-template-columns: 150px 1fr; gap:8px 12px; align-items:center; margin-bottom:10px; }
@media (max-width:640px){ .rb-form-demo .rb-fg { grid-template-columns:1fr; } }
.rb-form-demo .rb-fg > label { font-size:11px; font-weight:600; color:#676a6c; margin:0; text-align:right; }
@media (max-width:640px){ .rb-form-demo .rb-fg > label { text-align:left; } }
.rb-form-demo .rb-fg .form-control, .rb-form-demo .rb-fg select, .rb-form-demo .rb-fg input[type=text], .rb-form-demo .rb-fg input[type=date] {
  height:32px; border-radius:3px; border:1px solid #e0e4e8; font-size:13px; max-width:420px; width:100%;
}
.rb-form-demo .rb-fg-2 { display:grid; grid-template-columns:1fr 1fr; gap:10px 16px; }
@media (max-width:720px){ .rb-form-demo .rb-fg-2 { grid-template-columns:1fr; } }
.rb-form-demo .rb-actions { display:flex; gap:10px; justify-content:center; padding:12px 0; }
.rb-form-demo .table { font-size:12px; }
.rb-form-demo .table th { background:#f5f7fa; font-size:11px; }

/* Image / photo management pages */
body.rb-img-page { background: #f4f6f9 !important; }
.rb-img-page .wrapper-content { padding: 12px 14px !important; }
.rb-img-page .ibox { border: 0; box-shadow: none; background: transparent; margin: 0; }
.rb-img-page .ibox-title {
  background: #fff; border: 1px solid #e7eaec; border-radius: 4px 4px 0 0;
  border-bottom: 0; padding: 12px 14px; min-height: auto;
}
.rb-img-page .ibox-title h5 {
  font-size: 15px; font-weight: 700; color: #2f4050; margin: 0;
  display: inline-flex; align-items: center; gap: 8px;
}
.rb-img-page .ibox-title .rb-img-badge {
  display: inline-block; padding: 2px 8px; border-radius: 3px;
  background: #e8f4fc; color: #1690d8; font-size: 11px; font-weight: 700;
}
.rb-img-page .ibox-title .rb-img-badge.xray { background: #f3e8ff; color: #722ed1; }
.rb-img-page .ibox-tools { float: right; }
.rb-img-page .ibox-content {
  background: #fff; border: 1px solid #e7eaec; border-radius: 0 0 4px 4px;
  padding: 14px; box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.rb-img-page #addimg { width: 100%; border-collapse: separate; border-spacing: 10px; }
.rb-img-page #addimg td {
  background: #fafbfc; border: 1px solid #e7eaec; border-radius: 4px;
  padding: 8px !important; vertical-align: top; width: 20%;
  box-shadow: 0 1px 2px rgba(0,0,0,.03);
}
.rb-img-page #addimg td img {
  width: 100% !important; max-width: 100% !important; height: 160px !important;
  object-fit: cover; border-radius: 3px; cursor: pointer; background: #eef1f4;
  display: block;
}
.rb-img-page #addimg td a {
  display: inline-block; margin-top: 6px; font-size: 11px; font-weight: 600;
  color: #ed5565 !important; text-decoration: none;
}
.rb-img-page #addimg td a:hover { text-decoration: underline; }
.rb-img-page #addimg td span {
  display: block; margin-top: 4px; font-size: 10px; color: #a7b1c2;
  word-break: break-all; font-family: Consolas, Menlo, monospace;
}
.rb-img-page .rb-img-toolbar {
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  padding: 10px 0 12px; border-bottom: 1px solid #eef1f4; margin-bottom: 12px;
}
.rb-img-page .rb-img-toolbar .btn {
  height: 32px; padding: 0 14px; border-radius: 3px; font-size: 12px; font-weight: 600;
}
.rb-img-page .rb-img-toolbar .btn-primary { background: #1690d8; border-color: #1690d8; }
.rb-img-page .rb-img-toolbar .btn-primary:hover { background: #1280c0; border-color: #1280c0; }
.rb-img-page #imgPicker {
  float: none !important; margin: 0 !important;
  display: inline-block;
}
.rb-img-page #imgPicker .webuploader-pick,
.rb-img-page #imgPicker .webuploader-pick-hover {
  background: #1ab394 !important; border-radius: 3px !important;
  padding: 0 14px !important; height: 32px !important; line-height: 32px !important;
  font-size: 12px !important; font-weight: 600 !important;
  box-shadow: none !important;
}
.rb-img-page .uploader-list { float: none !important; display: inline-block; margin-left: 8px; font-size: 12px; color: #676a6c; }
.rb-img-page .modal-content { border-radius: 4px; border: 1px solid #e7eaec; overflow: hidden; }
.rb-img-page .modal-header { background: #2f4050; color: #fff; border: 0; padding: 10px 14px; }
.rb-img-page .modal-header .close { color: #fff; opacity: .85; text-shadow: none; }
.rb-img-page #showimg { max-width: 100%; max-height: 80vh; border-radius: 3px; }
.rb-img-page .hr-line-dashed { border-color: #eef1f4; margin: 12px 0; }

/* Image page inside layer iframe */
body.rb-img-embed .wrapper-content { padding: 8px 10px !important; }
body.rb-img-embed .ibox-title { border-radius: 3px 3px 0 0; }
body.rb-img-embed #addimg td img { height: 140px !important; }

/* Topbar brand logo */
body.rb-topnav .rb-brand {
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
}
body.rb-topnav .rb-brand .rb-brand-logo {
  height: 34px;
  width: auto;
  max-width: 200px;
  object-fit: contain;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.25));
}
body.rb-topnav .rb-brand .rb-brand-text {
  display: flex;
  flex-direction: column;
  line-height: 1.15;
}
body.rb-topnav .rb-brand .rb-brand-text b {
  font-size: 13px;
  font-weight: 700;
  color: #fff;
}
body.rb-topnav .rb-brand .rb-brand-text span {
  font-size: 10px;
  color: rgba(255,255,255,.5);
}
@media (max-width: 900px) {
  body.rb-topnav .rb-brand .rb-brand-text { display: none !important; }
}


/* ========== Layer dialogs — match new WMS style (ALL notices) ========== */
/* Professional notice system: no smile sprites, flat check / error / warn */

/* —— Dialog shells —— */
body .layui-layer.rb-layer,
body .layui-layer-dialog.rb-layer,
body .layui-layer.rb-layer-dialog,
body .layui-layer-dialog {
  border: 0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 18px 50px rgba(32, 48, 64, 0.28) !important;
  background: #fff !important;
}

/* Title bar */
body .layui-layer.rb-layer .layui-layer-title,
body .layui-layer-dialog .layui-layer-title,
body .layui-layer.rb-layer-dialog .layui-layer-title {
  height: 46px !important;
  line-height: 46px !important;
  padding: 0 52px 0 16px !important;
  margin: 0 !important;
  background: #2f4050 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .02em;
  position: relative !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* Dialog body text */
body .layui-layer.rb-layer.layui-layer-dialog .layui-layer-content,
body .layui-layer-dialog.rb-layer .layui-layer-content,
body .layui-layer-dialog .layui-layer-content,
body .layui-layer.rb-layer-dialog .layui-layer-content {
  padding: 18px 20px 8px !important;
  color: #2f4050 !important;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
  word-break: break-word;
  font-weight: 500 !important;
}
body .layui-layer.rb-layer.layui-layer-iframe .layui-layer-content {
  padding: 0 !important;
}
body .layui-layer.rb-layer .layui-layer-padding,
body .layui-layer-dialog .layui-layer-padding {
  padding: 20px 20px 12px 58px !important;
}

/* —— Replace layer sprite icons with clean CSS icons —— */
body .layui-layer .layui-layer-ico,
body .layui-layer-dialog .layui-layer-ico,
body .layui-layer-msg .layui-layer-ico {
  background-image: none !important;
  background: #eef2f6 !important;
  border-radius: 50% !important;
  width: 28px !important;
  height: 28px !important;
  top: 18px !important;
  left: 16px !important;
  position: absolute !important;
  box-sizing: border-box !important;
}
body .layui-layer .layui-layer-ico::before,
body .layui-layer-msg .layui-layer-ico::before {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  box-sizing: border-box !important;
}

/* success / ok — icon 1 & 6 (old smile) → check */
body .layui-layer .layui-layer-ico1,
body .layui-layer .layui-layer-ico6 {
  background: #e8f8f0 !important;
  border: 1.5px solid #1ab394 !important;
}
body .layui-layer .layui-layer-ico1::before,
body .layui-layer .layui-layer-ico6::before {
  width: 7px !important;
  height: 12px !important;
  border: solid #1ab394 !important;
  border-width: 0 2px 2px 0 !important;
  transform: translate(-50%, -58%) rotate(45deg) !important;
  background: transparent !important;
}

/* error — icon 2 & 5 */
body .layui-layer .layui-layer-ico2,
body .layui-layer .layui-layer-ico5 {
  background: #fff1f0 !important;
  border: 1.5px solid #ed5565 !important;
}
body .layui-layer .layui-layer-ico2::before,
body .layui-layer .layui-layer-ico5::before {
  width: 12px !important;
  height: 12px !important;
  transform: translate(-50%, -50%) !important;
  background:
    linear-gradient(#ed5565,#ed5565) center/12px 2px no-repeat,
    linear-gradient(#ed5565,#ed5565) center/2px 12px no-repeat !important;
  rotate: 45deg;
  -webkit-transform: translate(-50%, -50%) rotate(45deg) !important;
  transform: translate(-50%, -50%) rotate(45deg) !important;
}

/* warn / info — icon 0, 7, 3, 4 */
body .layui-layer .layui-layer-ico0,
body .layui-layer .layui-layer-ico7,
body .layui-layer .layui-layer-ico3,
body .layui-layer .layui-layer-ico4 {
  background: #eef7fc !important;
  border: 1.5px solid #1690d8 !important;
}
body .layui-layer .layui-layer-ico0::before,
body .layui-layer .layui-layer-ico7::before,
body .layui-layer .layui-layer-ico3::before,
body .layui-layer .layui-layer-ico4::before {
  content: "i" !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  font-style: italic !important;
  color: #1690d8 !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  border: 0 !important;
  transform: translate(-50%, -52%) !important;
  background: none !important;
}

/* confirm question — keep as blue "!" */
body .layui-layer-dialog .layui-layer-ico3::before {
  content: "!" !important;
  font-family: inherit !important;
  font-style: normal !important;
  font-size: 16px !important;
  font-weight: 800 !important;
}

/* Buttons */
body .layui-layer.rb-layer .layui-layer-btn,
body .layui-layer-dialog .layui-layer-btn,
body .layui-layer.rb-layer-dialog .layui-layer-btn {
  padding: 10px 16px 14px !important;
  text-align: right !important;
  background: #f7f9fc !important;
  border-top: 1px solid #e7eaec !important;
  pointer-events: auto;
}
body .layui-layer.rb-layer .layui-layer-btn a,
body .layui-layer-dialog .layui-layer-btn a,
body .layui-layer.rb-layer-dialog .layui-layer-btn a {
  height: 34px !important;
  line-height: 34px !important;
  margin: 0 0 0 8px !important;
  padding: 0 18px !important;
  border-radius: 4px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  border: 1px solid transparent !important;
  min-width: 76px;
  text-align: center;
  box-sizing: border-box;
}
body .layui-layer.rb-layer .layui-layer-btn .layui-layer-btn0,
body .layui-layer-dialog .layui-layer-btn .layui-layer-btn0,
body .layui-layer.rb-layer-dialog .layui-layer-btn .layui-layer-btn0 {
  background: #1690d8 !important;
  border-color: #1690d8 !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(22, 144, 216, 0.22);
}
body .layui-layer.rb-layer .layui-layer-btn .layui-layer-btn0:hover,
body .layui-layer-dialog .layui-layer-btn .layui-layer-btn0:hover {
  background: #1280c0 !important;
  border-color: #1280c0 !important;
}
body .layui-layer.rb-layer .layui-layer-btn .layui-layer-btn1,
body .layui-layer-dialog .layui-layer-btn .layui-layer-btn1,
body .layui-layer.rb-layer-dialog .layui-layer-btn .layui-layer-btn1 {
  background: #fff !important;
  border-color: #c5cdd6 !important;
  color: #2f4050 !important;
}
body .layui-layer.rb-layer .layui-layer-btn .layui-layer-btn1:hover,
body .layui-layer-dialog .layui-layer-btn .layui-layer-btn1:hover {
  background: #f5f7fa !important;
  border-color: #a7b1c2 !important;
}

/* —— Toast msg：自訂 rb-toast（無 layer sprite） —— */
body .layui-layer-msg,
body .layui-layer-msg.rb-layer-msg,
body .layui-layer.rb-layer-msg,
body .layui-layer-hui,
body .layui-layer.rb-toast-host {
  min-width: 0 !important;
  max-width: min(380px, 92vw) !important;
  border-radius: 8px !important;
  border: 1px solid #e2e6eb !important;
  box-shadow: 0 10px 30px rgba(32, 48, 64, 0.16) !important;
  background: #fff !important;
  color: #2f4050 !important;
  overflow: hidden !important;
  padding: 0 !important;
}
/* 去掉 layer 內建 ico 佔位 */
body .layui-layer-msg .layui-layer-ico,
body .layui-layer.rb-toast-host .layui-layer-ico {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
}
body .layui-layer-msg .layui-layer-content,
body .layui-layer.rb-layer-msg .layui-layer-content,
body .layui-layer.rb-toast-host .layui-layer-content {
  padding: 0 !important;
  text-align: left !important;
  background: transparent !important;
}
body .layui-layer-msg .layui-layer-padding,
body .layui-layer.rb-toast-host .layui-layer-padding {
  padding: 0 !important;
}

/* toast 本體 */
body .rb-toast {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 12px 16px 12px 14px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
  position: relative !important;
}
body .rb-toast::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important; top: 0 !important; bottom: 0 !important;
  width: 3px !important;
  background: #1690d8 !important;
  border-radius: 8px 0 0 8px !important;
}
body .rb-toast-ok::before { background: #1ab394 !important; }
body .rb-toast-err::before { background: #ed5565 !important; }
body .rb-toast-info::before,
body .rb-toast-warn::before { background: #1690d8 !important; }

body .rb-toast-host-ok,
body .layui-layer.rb-toast-host-ok {
  border-color: #c6ebe0 !important;
  background: #f7fffc !important;
}
body .rb-toast-host-err,
body .layui-layer.rb-toast-host-err {
  border-color: #f5c6cb !important;
  background: #fffafa !important;
}
body .rb-toast-host-info,
body .rb-toast-host-warn,
body .layui-layer.rb-toast-host-info {
  border-color: #c5e4f6 !important;
  background: #f7fbfe !important;
}

body .rb-toast-ico {
  flex: 0 0 22px !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  position: relative !important;
  display: inline-block !important;
  border: 1.5px solid currentColor !important;
  background: transparent !important;
}
body .rb-toast-ok .rb-toast-ico {
  color: #1ab394 !important;
  background: #e8f8f0 !important;
}
body .rb-toast-ok .rb-toast-ico::after {
  content: "" !important;
  position: absolute !important;
  left: 7px !important;
  top: 3px !important;
  width: 5px !important;
  height: 9px !important;
  border: solid #1ab394 !important;
  border-width: 0 2px 2px 0 !important;
  transform: rotate(45deg) !important;
}
body .rb-toast-err .rb-toast-ico {
  color: #ed5565 !important;
  background: #fff1f0 !important;
}
body .rb-toast-err .rb-toast-ico::before,
body .rb-toast-err .rb-toast-ico::after {
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 10px !important;
  height: 2px !important;
  background: #ed5565 !important;
  border-radius: 1px !important;
}
body .rb-toast-err .rb-toast-ico::before {
  transform: translate(-50%, -50%) rotate(45deg) !important;
}
body .rb-toast-err .rb-toast-ico::after {
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}
body .rb-toast-info .rb-toast-ico,
body .rb-toast-warn .rb-toast-ico {
  color: #1690d8 !important;
  background: #e8f4fb !important;
  text-align: center !important;
  line-height: 19px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-style: italic !important;
}
body .rb-toast-info .rb-toast-ico::after {
  content: "i" !important;
  position: absolute !important;
  left: 0 !important; right: 0 !important; top: 0 !important; bottom: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #1690d8 !important;
  font-style: italic !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  line-height: 22px !important;
}

body .rb-toast-txt {
  flex: 1 1 auto !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #2f4050 !important;
  line-height: 1.35 !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  max-width: 300px !important;
}

/* shade */
body .layui-layer-shade {
  background-color: #1e2a36 !important;
  opacity: 0.42 !important;
}

/* multi-line lists in alerts */
body .layui-layer-dialog .layui-layer-content ul {
  margin: 6px 0 8px 4px !important;
  padding-left: 18px !important;
}
body .layui-layer-dialog .layui-layer-content ul li {
  margin: 2px 0 !important;
  font-family: Consolas, Menlo, monospace;
  font-weight: 600;
  color: #2f4050;
  font-size: 12.5px;
}

/* ========== end layer notices ========== 

/* Registration / card action rail — compact, all visible, not cramped */
.rb-card-demo-acts {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  min-width: 108px;
  max-width: 118px;
  padding: 10px 8px !important;
  justify-content: flex-start;
  flex-wrap: nowrap !important;
  border-left: 1px solid #eef1f4;
  background: linear-gradient(180deg, #fafbfc 0%, #f4f6f9 100%);
}
.rb-card-demo-acts .rb-act-primary,
.rb-card-demo-acts .rb-act-outline,
.rb-card-demo-acts .rb-act-ghost,
.rb-card-demo-acts .rb-act-danger,
.rb-card-demo-acts .rb-act-soft {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  width: 100%;
  height: 30px !important;
  padding: 0 8px !important;
  margin: 0 !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  box-sizing: border-box;
  text-decoration: none !important;
  white-space: nowrap;
}
.rb-card-demo-acts .rb-act-primary {
  background: #1690d8 !important;
  border: 1px solid #1690d8 !important;
  color: #fff !important;
  box-shadow: 0 1px 3px rgba(22,144,216,.25);
}
.rb-card-demo-acts .rb-act-primary:hover {
  background: #1280c0 !important;
  border-color: #1280c0 !important;
  color: #fff !important;
}
.rb-card-demo-acts .rb-act-outline,
.rb-card-demo-acts .rb-act-soft {
  background: #fff !important;
  border: 1px solid #d5dbe3 !important;
  color: #2f4050 !important;
}
.rb-card-demo-acts .rb-act-outline:hover,
.rb-card-demo-acts .rb-act-soft:hover {
  border-color: #1690d8 !important;
  color: #1690d8 !important;
  background: #f0f8fd !important;
}
.rb-card-demo-acts .rb-act-ghost {
  background: #fff !important;
  border: 1px solid #d5dbe3 !important;
  color: #2f4050 !important;
}
.rb-card-demo-acts .rb-act-ghost:hover {
  border-color: #1690d8 !important;
  color: #1690d8 !important;
}
.rb-card-demo-acts .rb-act-ghost.rb-act-receipt-on {
  background: #e8f8f4 !important;
  border-color: #1ab394 !important;
  color: #1ab394 !important;
}
.rb-card-demo-acts .rb-act-danger {
  background: #fff !important;
  border: 1px solid #f0b4bb !important;
  color: #ed5565 !important;
  margin-top: 2px !important;
}
.rb-card-demo-acts .rb-act-danger:hover {
  background: #ed5565 !important;
  border-color: #ed5565 !important;
  color: #fff !important;
}
.rb-card-demo-acts i.fa {
  width: 14px;
  text-align: center;
  font-size: 12px;
  opacity: .9;
}
/* divider between primary group and print group */
.rb-card-demo-acts .rb-act-sep {
  height: 1px;
  background: #e7eaec;
  margin: 2px 0;
  border: 0;
}
@media (max-width: 640px) {
  .rb-card-demo-acts {
    flex-direction: row;
    flex-wrap: wrap !important;
    max-width: none;
    min-width: 0;
    width: 100%;
    border-left: 0;
    border-top: 1px solid #eef1f4;
  }
  .rb-card-demo-acts .rb-act-primary,
  .rb-card-demo-acts .rb-act-outline,
  .rb-card-demo-acts .rb-act-ghost,
  .rb-card-demo-acts .rb-act-danger,
  .rb-card-demo-acts .rb-act-soft {
    width: auto;
    flex: 1 1 auto;
    min-width: calc(33% - 4px);
    justify-content: center;
  }
  .rb-card-demo-acts .rb-act-sep { display: none; }
}

/* Title-row icon actions (Edit / Del next to client + S/O) */
.rb-card-demo-line1 {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-height: 28px;
}
.rb-card-demo-line1 .rb-title-acts {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}
.rb-ico-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0 !important;
  border-radius: 4px;
  border: 1px solid #d5dbe3;
  background: #fff;
  color: #2f4050;
  text-decoration: none !important;
  font-size: 13px;
  line-height: 1;
  transition: border-color .12s, background .12s, color .12s;
}
.rb-ico-btn:hover {
  border-color: #1690d8;
  color: #1690d8;
  background: #f0f8fd;
}
.rb-ico-btn.rb-ico-edit {
  border-color: rgba(22,144,216,.45);
  color: #1690d8;
}
.rb-ico-btn.rb-ico-edit:hover {
  background: #1690d8;
  border-color: #1690d8;
  color: #fff !important;
}
.rb-ico-btn.rb-ico-del {
  border-color: rgba(237,85,101,.4);
  color: #ed5565;
}
.rb-ico-btn.rb-ico-del:hover {
  background: #ed5565;
  border-color: #ed5565;
  color: #fff !important;
}
/* print rail narrower without edit/del */
.rb-card-demo-acts {
  min-width: 100px;
  max-width: 110px;
}

/* ===== v20260731v91 force vertical print rail (Unloading + Registration) ===== */
.rb-card-demo-inner {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
}
.rb-card-demo-main {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.rb-card-demo-acts {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  flex: 0 0 112px !important;
  width: 112px !important;
  min-width: 112px !important;
  max-width: 112px !important;
  padding: 10px 8px !important;
  border-top: 0 !important;
  border-left: 1px solid #eef1f4 !important;
  background: linear-gradient(180deg, #fafbfc 0%, #f4f6f9 100%) !important;
  box-sizing: border-box !important;
}
.rb-card-demo-acts > a {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  width: 100% !important;
  height: 30px !important;
  padding: 0 8px !important;
  margin: 0 !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
.rb-card-demo-acts > a.rb-act-soft,
.rb-card-demo-acts > a.rb-act-outline {
  background: #fff !important;
  border: 1px solid #d5dbe3 !important;
  color: #2f4050 !important;
}
.rb-card-demo-acts > a.rb-act-soft:hover,
.rb-card-demo-acts > a.rb-act-outline:hover {
  border-color: #1690d8 !important;
  color: #1690d8 !important;
  background: #f0f8fd !important;
}
.rb-card-demo-acts > a.rb-act-ghost {
  background: #fff !important;
  border: 1px solid #d5dbe3 !important;
  color: #2f4050 !important;
}
.rb-card-demo-acts > a.rb-act-ghost.rb-act-receipt-on {
  background: #e8f8f4 !important;
  border-color: #1ab394 !important;
  color: #1ab394 !important;
}
.rb-card-demo-acts > a i.fa {
  width: 14px;
  text-align: center;
  font-size: 12px;
}
/* title icons stay on the right of header row */
.rb-card-demo-line1 {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}
.rb-card-demo-line1 .rb-title-acts {
  margin-left: auto !important;
  display: inline-flex !important;
  gap: 4px !important;
}
@media (max-width: 720px) {
  .rb-card-demo-inner {
    flex-wrap: wrap !important;
  }
  .rb-card-demo-acts {
    flex: 1 1 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    border-left: 0 !important;
    border-top: 1px solid #eef1f4 !important;
  }
  .rb-card-demo-acts > a {
    width: auto !important;
    flex: 1 1 calc(50% - 4px) !important;
    justify-content: center !important;
  }
}



/* ===== Truck Order cards = demo parity v20260731v101 ===== */
.rb-to-card {
  border: 1px solid #e7eaec;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  overflow: hidden;
  margin: 0 0 10px;
}
/* Deleted truck order — subtle (not loud red) */
.rb-to-card.is-red,
.rb-to-card.is-deleted {
  border-color: #e2e5e9;
  background: #f6f7f9;
  box-shadow: none;
  opacity: 0.72;
}
.rb-to-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  border-left: 4px solid #1690d8;
}
.rb-to-card.is-red .rb-to-inner,
.rb-to-card.is-deleted .rb-to-inner {
  border-left-color: #c5cad1;
  border-left-style: dashed;
}
.rb-to-main { flex: 1; min-width: 0; padding: 10px 12px; }
.rb-to-head {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px;
}
.rb-to-client {
  font-size: 13px; font-weight: 700; color: #2f4050;
}
.rb-to-card.is-red .rb-to-client,
.rb-to-card.is-deleted .rb-to-client {
  color: #8b919a;
  text-decoration: none;
  font-weight: 600;
}
.rb-to-del-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 4px;
  padding: 1px 7px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: #fff;
  background: #ed5565;
  border: 1px solid #e44555;
  line-height: 1.4;
  box-shadow: 0 1px 1px rgba(237,85,101,.2);
}
.rb-to-date { font-size: 11px; color: #888; font-variant-numeric: tabular-nums; }

/* Serial No. (pl) — only when client filter selected (same as old pl-show) */
.rb-to-serial,
.pl-show.rb-to-serial {
  display: none;
  align-items: center;
  gap: 5px;
  margin-left: 4px;
  padding: 2px 9px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  color: #1690d8;
  background: #e8f4fb;
  border: 1px solid rgba(22,144,216,.35);
  line-height: 1.4;
}
.rb-to-serial b,
.pl-show.rb-to-serial b {
  font-family: Consolas, Menlo, monospace;
  font-size: 13px;
  font-weight: 800;
  color: #0d6ea8;
  letter-spacing: .02em;
}
.rb-to-serial i.fa {
  font-family: FontAwesome !important;
  font-style: normal !important;
  font-size: 11px;
  opacity: .9;
}
body.rb-to-serial-on .rb-to-serial,
body.rb-to-serial-on .pl-show {
  display: inline-flex !important;
}

/* Plate / mobile / name / id chips (demo style) */
.rb-to-plates {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.rb-to-plate-card {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  padding: 5px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: linear-gradient(180deg, #fbfcfe 0%, #f4f7fa 100%);
}
.rb-to-pchip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: #2f4050;
  padding: 2px 8px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #e7eaec;
  line-height: 1.35;
  white-space: nowrap;
}
.rb-to-pchip i.fa {
  font-size: 10px;
  opacity: .75;
  width: 12px;
  text-align: center;
}
.rb-to-pchip.plate {
  border-color: #b6dff5;
  background: #e8f4fb;
  color: #0f6fad;
  font-weight: 700;
}
.rb-to-pchip.plate b {
  font-family: Consolas, Menlo, monospace;
  font-size: 12px;
  letter-spacing: .02em;
  font-weight: 700;
}
.rb-to-pchip.mobile {
  color: #1a7a4c;
  border-color: #c6e9d6;
  background: #f0faf4;
}
.rb-to-pchip.name { color: #2f4050; background: #fff; }
.rb-to-pchip.hkid {
  font-family: Consolas, Menlo, monospace;
  color: #676a6c;
  border-style: dashed;
  background: #fff;
}
.rb-to-pchip.hkid::before { content: none; }
/* legacy blob plate never show */
.rb-to-plate { display: none !important; }

/* From / To — demo height (taller + scroll) */
.rb-to-ft {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin-top: 8px !important;
}
@media (max-width: 700px) {
  .rb-to-ft { grid-template-columns: 1fr !important; }
}
.rb-to-box {
  border: 1px solid rgba(231,234,236,.9) !important;
  border-radius: 3px !important;
  background: #f9f9f9 !important;
  padding: 6px 10px !important;
  min-height: 0 !important;
  max-height: 96px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}
.rb-to-box-label {
  font-size: 9px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: #888 !important;
  letter-spacing: .04em !important;
  margin-bottom: 4px !important;
  line-height: 1.2 !important;
  flex-shrink: 0 !important;
}
.rb-to-box-body {
  font-size: 11px !important;
  color: #333 !important;
  white-space: pre-wrap !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  font-family: inherit !important;
  max-height: 72px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  flex: 1 1 auto !important;
  -webkit-line-clamp: unset !important;
  display: block !important;
}
.rb-to-box-body::-webkit-scrollbar { width: 5px; }
.rb-to-box-body::-webkit-scrollbar-thumb {
  background: #cfd6de; border-radius: 4px;
}
.rb-to-card.is-red .rb-to-box-body,
.rb-to-card.is-deleted .rb-to-box-body {
  color: #9aa0a6 !important;
}
.rb-to-card.is-red .rb-to-box,
.rb-to-card.is-deleted .rb-to-box {
  background: #eef0f3;
  border-color: #e0e3e7;
}


.rb-to-table-wrap {
  margin-top: 8px;
  overflow-x: auto;
  border: 1px solid #e7eaec;
  border-radius: 3px;
}
.rb-to-table {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  font-size: 11px;
  text-align: left;
}
.rb-to-table thead th {
  background: #f5f5f6;
  color: #888;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: 5px 8px;
  border-bottom: 1px solid #e7eaec;
}
.rb-to-table tbody td {
  padding: 6px 8px;
  border-top: 1px solid #eee;
  vertical-align: top;
  color: #333;
}
.rb-to-table tbody tr:nth-child(even) { background: #fafbfc; }
.rb-to-table .so {
  font-family: Consolas, Menlo, monospace;
  font-weight: 600;
  color: #1690d8;
}
.rb-to-card.is-red .rb-to-table .so,
.rb-to-card.is-red .rb-to-table td,
.rb-to-card.is-deleted .rb-to-table .so,
.rb-to-card.is-deleted .rb-to-table td {
  color: #9aa0a6;
}
.rb-to-card.is-red .rb-to-table thead th,
.rb-to-card.is-deleted .rb-to-table thead th {
  color: #a0a5ab;
  background: #eef0f3;
}
.rb-to-card.is-red .rb-to-table-wrap,
.rb-to-card.is-deleted .rb-to-table-wrap {
  opacity: 0.9;
}

.rb-to-remark {
  margin: 8px 0 0;
  font-size: 11px;
  color: #333;
  line-height: 1.45;
}
.rb-to-card.is-red .rb-to-remark,
.rb-to-card.is-deleted .rb-to-remark {
  color: #9aa0a6;
}
.rb-to-card.is-red .rb-to-log,
.rb-to-card.is-deleted .rb-to-log {
  color: #a8adb3;
}
.rb-to-card.is-red .rb-to-pchip,
.rb-to-card.is-deleted .rb-to-pchip {
  opacity: 0.75;
  filter: grayscale(0.35);
}
.rb-to-card.is-red .rb-to-date,
.rb-to-card.is-deleted .rb-to-date {
  color: #a8adb3;
}

.rb-to-docs {
  display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px;
}
.rb-to-doc {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 6px;
  border-radius: 2px;
  font-size: 10px;
  border: 1px solid #c3e6cb;
  background: #dff0d8;
  color: #3c763d;
  text-decoration: none !important;
}
.rb-to-doc:hover { background: #c8e6c9; color: #2b542c !important; }
.rb-to-log {
  margin-top: 6px;
  font-size: 10px;
  color: #a7b1c2;
}
.rb-to-acts {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 10px;
  border-left: 1px solid #eef1f4;
  background: #fafbfc;
  flex: 0 0 118px;
  justify-content: flex-start;
}
@media (max-width: 720px) {
  .rb-to-acts {
    flex: 1 1 100%;
    flex-direction: row;
    flex-wrap: wrap;
    border-left: 0;
    border-top: 1px solid #eef1f4;
  }
  .rb-to-acts > a { flex: 1 1 calc(50% - 4px); justify-content: center; }
}
.rb-to-acts > a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 30px;
  padding: 0 10px;
  border-radius: 3px;
  font-size: 11px;
  font-weight: 600;
  text-decoration: none !important;
  border: 1px solid #d5dbe3;
  background: #fff;
  color: #2f4050 !important;
  white-space: nowrap;
}
.rb-to-acts > a:hover {
  border-color: #1690d8;
  color: #1690d8 !important;
  background: #f0f8fd;
}
.rb-to-acts > a.rb-act-primary {
  background: #1690d8;
  border-color: #1690d8;
  color: #fff !important;
}
.rb-to-acts > a.rb-act-primary:hover {
  background: #1280c0;
  border-color: #1280c0;
  color: #fff !important;
}
.rb-to-acts > a.rb-act-danger {
  border-color: #f0b4bb;
  color: #ed5565 !important;
}
.rb-to-acts > a.rb-act-danger:hover {
  background: #ed5565;
  border-color: #ed5565;
  color: #fff !important;
}
.rb-to-acts > a.rb-act-receipt-on {
  border-color: #1ab394;
  color: #1ab394 !important;
}


/* ===== Plan / global Del red force v20260731v106 ===== */
a.rb-act-danger,
.rb-act-danger,
.rb-plan-side a.rb-act-danger,
.rb-plan-side .rb-act-danger,
.rb-card-demo-acts a.rb-act-danger {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  height: 28px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  border-radius: 3px !important;
  background: #fff !important;
  border: 1px solid #f0b4bb !important;
  color: #ed5565 !important;
  text-decoration: none !important;
  box-shadow: none !important;
}
a.rb-act-danger:hover,
a.rb-act-danger:focus,
.rb-act-danger:hover,
.rb-plan-side a.rb-act-danger:hover,
.rb-plan-side .rb-act-danger:hover {
  background: #ed5565 !important;
  border-color: #ed5565 !important;
  color: #fff !important;
  text-decoration: none !important;
}
a.rb-act-danger i.fa,
.rb-plan-side a.rb-act-danger i.fa {
  color: inherit !important;
}
@media (min-width: 900px) {
  .rb-plan-side a.rb-act-danger {
    width: 100% !important;
  }
}

/* ===== Registration / Unloading S/O table force v20260731v109 ===== */
.rb-reg-lines {
  margin-top: 8px !important;
  overflow-x: auto !important;
  border: 1px solid #e7eaec !important;
  border-radius: 3px !important;
  background: #fff !important;
}
.rb-reg-lines table,
.rb-reg-lines > table {
  width: 100% !important;
  min-width: 280px !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  font-size: 12px !important;
  display: table !important;
  table-layout: auto !important;
  margin: 0 !important;
}
.rb-reg-lines thead { display: table-header-group !important; }
.rb-reg-lines tbody { display: table-row-group !important; }
.rb-reg-lines tfoot { display: table-footer-group !important; background: #f7f9fc !important; }
.rb-reg-lines tr { display: table-row !important; }
.rb-reg-lines th,
.rb-reg-lines td {
  display: table-cell !important;
  padding: 7px 10px !important;
  vertical-align: middle !important;
  border-bottom: 1px solid #eef1f4 !important;
  white-space: nowrap !important;
  float: none !important;
  width: auto !important;
}
.rb-reg-lines th {
  background: #f5f7fa !important;
  color: #888 !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .03em !important;
  border-bottom: 1px solid #e7eaec !important;
}
.rb-reg-lines th:last-child,
.rb-reg-lines td.pcs {
  text-align: right !important;
}
.rb-reg-lines td.so {
  font-family: Consolas, Menlo, monospace !important;
  font-weight: 600 !important;
  color: #1690d8 !important;
  font-size: 12px !important;
}
.rb-reg-lines td.port {
  color: #2f4050 !important;
  font-weight: 500 !important;
}
.rb-reg-lines td.pcs {
  font-variant-numeric: tabular-nums !important;
  font-weight: 600 !important;
  color: #2f4050 !important;
}
.rb-reg-lines tbody tr:nth-child(even) td { background: #fafbfc !important; }
.rb-reg-lines tbody tr:hover td { background: #f0f8fd !important; }
.rb-reg-lines tfoot td {
  border-bottom: 0 !important;
  font-weight: 700 !important;
  color: #2f4050 !important;
  font-size: 11px !important;
}
.rb-reg-lines tfoot td.pcs {
  color: #1690d8 !important;
}

/* Plan edit +/- match new WMS (pill / square icon, not toy circles) v20260731v109 */
.rb-pe .add-type,
.rb-pe .remove-type,
.rb-pe .add-list,
.rb-pe .add-spno,
.rb-pe .remove-item {
  width: auto !important;
  min-width: 28px !important;
  height: 28px !important;
  border-radius: 3px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 26px !important;
  text-align: center !important;
  cursor: pointer !important;
  margin: 0 0 0 4px !important;
  box-shadow: none !important;
  transform: none !important;
  border: 1px solid transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 8px !important;
  vertical-align: middle !important;
  user-select: none !important;
}
.rb-pe .add-type,
.rb-pe .add-list {
  background: #fff !important;
  border-color: rgba(22,144,216,.45) !important;
  color: #1690d8 !important;
}
.rb-pe .add-type:hover,
.rb-pe .add-list:hover {
  background: #1690d8 !important;
  border-color: #1690d8 !important;
  color: #fff !important;
  transform: none !important;
}
.rb-pe .add-spno {
  background: #fff !important;
  border-color: rgba(26,179,148,.5) !important;
  color: #1ab394 !important;
  margin-right: 10px !important;
}
.rb-pe .add-spno:hover {
  background: #1ab394 !important;
  border-color: #1ab394 !important;
  color: #fff !important;
  transform: none !important;
}
.rb-pe .remove-type,
.rb-pe .remove-item {
  background: #fff !important;
  border-color: #f0b4bb !important;
  color: #ed5565 !important;
}
.rb-pe .remove-type:hover,
.rb-pe .remove-item:hover {
  background: #ed5565 !important;
  border-color: #ed5565 !important;
  color: #fff !important;
  transform: none !important;
}
/* slightly tighter pair block */
.rb-pe .add-pair-container {
  border: 1px solid #e7eaec !important;
  border-left: 3px solid #1690d8 !important;
  border-radius: 3px !important;
  padding: 12px 12px 8px !important;
  background: #fafbfc !important;
}
.rb-pe .add-spno-div {
  background: #fff !important;
  border: 1px solid #eef1f4 !important;
  border-radius: 3px !important;
  padding: 8px 10px !important;
  margin-top: 8px !important;
}


/* Truck Order acts match other pages v20260731v123 */
.rb-to-acts {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 10px !important;
  border-left: 1px solid #eef1f4 !important;
  background: #fafbfc !important;
  flex: 0 0 118px !important;
  justify-content: flex-start !important;
}
.rb-to-acts > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  height: 30px !important;
  padding: 0 10px !important;
  border-radius: 3px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}
.rb-to-acts > a.rb-act-primary {
  background: #1690d8 !important;
  border: 1px solid #1690d8 !important;
  color: #fff !important;
}
.rb-to-acts > a.rb-act-primary:hover {
  background: #0f6fad !important;
  border-color: #0f6fad !important;
  color: #fff !important;
}
.rb-to-acts > a.rb-act-outline {
  background: #fff !important;
  border: 1px solid rgba(22,144,216,.4) !important;
  color: #1690d8 !important;
}
.rb-to-acts > a.rb-act-outline:hover {
  background: #1690d8 !important;
  color: #fff !important;
}
.rb-to-acts > a.rb-act-outline.rb-act-receipt-on {
  background: #e8f8f4 !important;
  border-color: #1ab394 !important;
  color: #1ab394 !important;
  font-weight: 700 !important;
}
.rb-to-acts > a.rb-act-outline.rb-act-receipt-on:hover {
  background: #1ab394 !important;
  color: #fff !important;
}

/* Truck Order / Report：已上传 Receipt 图片 */
.rb-to-card.has-receipt {
  border-color: #7dceb0 !important;
  box-shadow: 0 0 0 1px rgba(26,179,148,.18), 0 1px 3px rgba(26,179,148,.12);
}
.rb-to-card.has-receipt:not(.is-red):not(.is-deleted) .rb-to-client {
  color: #0e8f72;
}
.rb-to-card.has-receipt:not(.is-red):not(.is-deleted) .rb-to-head::after {
  content: 'Receipt';
  margin-left: 8px;
  font-size: 10px;
  font-weight: 800;
  color: #fff;
  background: #1ab394;
  border-radius: 3px;
  padding: 2px 6px;
  letter-spacing: .02em;
  vertical-align: middle;
}

.rb-to-acts > a.rb-act-danger {
  background: #fff !important;
  border: 1px solid #f0b4bb !important;
  color: #ed5565 !important;
}
.rb-to-acts > a.rb-act-danger:hover {
  background: #ed5565 !important;
  border-color: #ed5565 !important;
  color: #fff !important;
}

/* Truck toolbar: date + client chips one row */
.rb-to-toolbar {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 10px 14px !important;
  margin-bottom: 4px !important;
}
.rb-to-toolbar .rb-date-nav {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex-shrink: 0 !important;
}
.rb-to-toolbar .rb-date-nav .btn {
  height: 32px !important;
  min-width: 34px !important;
  padding: 0 10px !important;
  line-height: 30px !important;
}
.rb-to-toolbar .rb-date-nav input[type="date"] {
  height: 32px !important;
  width: 150px !important;
  display: inline-block !important;
  vertical-align: middle !important;
}
.rb-to-toolbar .rb-to-users {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.rb-to-toolbar .rb-to-users .userkey,
.rb-to-toolbar .rb-to-users a.userkey {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: 28px !important;
  padding: 0 10px !important;
  margin: 0 !important;
  border-radius: 3px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  background: #fff !important;
  border: 1px solid #dce2e8 !important;
  color: #2f4050 !important;
  text-decoration: none !important;
  line-height: 26px !important;
}
.rb-to-toolbar .rb-to-users .userkey:hover {
  border-color: #1690d8 !important;
  color: #1690d8 !important;
  background: #f0f8fd !important;
}
.rb-to-toolbar .rb-to-users .userkey.active,
.rb-to-toolbar .rb-to-users .userkey.is-on {
  background: #1690d8 !important;
  border-color: #1690d8 !important;
  color: #fff !important;
}
.rb-to-toolbar .rb-to-create {
  margin-left: auto !important;
  flex-shrink: 0 !important;
}
.rb-to-toolbar .list_user_dashed,
.rb-to-page .list_user_dashed {
  display: none !important;
}
/* UI switch chip */
.rb-ui-switch {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
  border: 1px solid rgba(255,255,255,.22) !important;
  border-radius: 3px !important;
  overflow: hidden !important;
  margin-right: 10px !important;
  flex-shrink: 0 !important;
}
.rb-ui-switch a {
  display: inline-flex !important;
  align-items: center !important;
  height: 26px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: rgba(255,255,255,.7) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: 0 !important;
}
.rb-ui-switch a:hover { color: #fff !important; background: rgba(255,255,255,.08) !important; }
.rb-ui-switch a.is-on {
  background: #1690d8 !important;
  color: #fff !important;
}
/* classic top bar switch */
.rb-ui-switch.classic-bar {
  border-color: rgba(255,255,255,.3) !important;
  margin: 0 12px 0 0 !important;
  vertical-align: middle !important;
}
.rb-ui-switch.classic-bar a { color: rgba(255,255,255,.85) !important; }



/* Sea inbound side buttons + img embed fix v20260731v125 */
.rb-ib4-side a.rb-act-primary {
  background: #1690d8 !important; border-color: #1690d8 !important; color: #fff !important;
}
.rb-ib4-side a.rb-act-primary:hover {
  background: #0f6fad !important; border-color: #0f6fad !important; color: #fff !important;
}
.rb-ib4-side a.rb-act-danger {
  background: #fff !important; border-color: #f0b4bb !important; color: #ed5565 !important;
}
.rb-ib4-side a.rb-act-danger:hover {
  background: #ed5565 !important; border-color: #ed5565 !important; color: #fff !important;
}
.rb-ib4-side a.rb-act-outline.rb-act-on,
.rb-ib4-side a.rb-act-on {
  background: #e8f8f4 !important; border-color: #1ab394 !important; color: #1ab394 !important;
}
body.rb-img-embed {
  background: #fff !important; margin: 0 !important; padding: 0 !important; overflow-x: hidden !important;
}
body.rb-img-embed .wrapper-content { padding: 10px 12px 16px !important; margin: 0 !important; }
body.rb-img-embed .ibox {
  margin: 0 !important; border: 1px solid #e7eaec !important; border-radius: 4px !important;
  background: #fff !important; box-shadow: none !important; overflow: hidden !important;
}
body.rb-img-embed .ibox-title {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  float: none !important; min-height: 40px !important; padding: 8px 12px !important; margin: 0 !important;
  border-bottom: 1px solid #eef1f4 !important; background: #fafbfc !important;
}
body.rb-img-embed .ibox-title h5 {
  float: none !important; margin: 0 !important; font-size: 13px !important; font-weight: 700 !important; color: #2f4050 !important;
}
body.rb-img-embed .ibox-tools {
  float: none !important; position: static !important; display: flex !important; gap: 8px !important; align-items: center !important;
}
body.rb-img-embed .ibox-content {
  clear: both !important; float: none !important; padding: 12px !important; background: #fff !important; border: 0 !important;
}
body.rb-img-embed .rb-img-toolbar {
  display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important;
  margin: 0 0 12px !important; padding: 10px !important; background: #f7f9fc !important;
  border: 1px solid #e7eaec !important; border-radius: 3px !important; float: none !important;
}
body.rb-img-embed .rb-img-toolbar .btn,
body.rb-img-embed .rb-img-toolbar a.btn {
  height: 32px !important; line-height: 30px !important; padding: 0 12px !important;
  font-size: 12px !important; font-weight: 600 !important; border-radius: 3px !important; margin: 0 !important;
}
body.rb-img-embed #addimg {
  width: 100% !important; table-layout: fixed !important; border-collapse: separate !important;
  border-spacing: 8px !important; margin: 0 !important;
}
body.rb-img-embed #addimg td {
  width: 20% !important; vertical-align: top !important; text-align: center !important;
  background: #fafbfc !important; border: 1px solid #e7eaec !important; border-radius: 4px !important; padding: 8px !important;
}
body.rb-img-embed #addimg td img {
  width: 100% !important; max-width: 100% !important; height: 120px !important; object-fit: cover !important;
  border-radius: 3px !important; border: 1px solid #e7eaec !important; cursor: pointer !important;
  display: block !important; margin: 0 auto 6px !important;
}
body.rb-img-embed #addimg .rb-img-del {
  display: inline-block !important; color: #ed5565 !important; font-size: 11px !important;
  font-weight: 600 !important; text-decoration: none !important;
}
body.rb-img-embed #addimg td span {
  display: block !important; font-size: 10px !important; color: #a7b1c2 !important;
  word-break: break-all !important; margin-top: 4px !important; line-height: 1.3 !important;
}
body.rb-img-embed #imgPicker { float: none !important; display: inline-block !important; }
body.rb-img-embed .uploader-list { float: none !important; display: inline-block !important; margin: 0 0 0 8px !important; }
body.rb-img-embed .form-horizontal .form-group { margin-left: 0 !important; margin-right: 0 !important; }
body.rb-img-embed .col-sm-2, body.rb-img-embed .col-sm-offset-1 {
  width: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; display: inline-block !important;
}
body.rb-img-embed .hr-line-dashed { display: none !important; }
body.rb-img-embed #showimg { max-width: 100% !important; max-height: 70vh !important; margin: 12px auto 0 !important; display: block !important; }



/* Tally list-row acts same as sea inbound v20260731v126 */
.rb-list-row-acts a,
.rb-list-row-acts .rb-act-primary,
.rb-list-row-acts .rb-act-outline,
.rb-list-row-acts .rb-act-danger {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 5px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 10px !important;
  margin: 0 !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  background: #fff !important;
  border: 1px solid #d5dbe3 !important;
  color: #2f4050 !important;
}
.rb-list-row-acts a:hover {
  border-color: #1690d8 !important; color: #1690d8 !important; background: #f0f8fd !important;
}
.rb-list-row-acts a.rb-act-primary {
  background: #1690d8 !important; border-color: #1690d8 !important; color: #fff !important;
}
.rb-list-row-acts a.rb-act-primary:hover {
  background: #0f6fad !important; border-color: #0f6fad !important; color: #fff !important;
}
.rb-list-row-acts a.rb-act-danger {
  background: #fff !important; border-color: #f0b4bb !important; color: #ed5565 !important;
}
.rb-list-row-acts a.rb-act-danger:hover {
  background: #ed5565 !important; border-color: #ed5565 !important; color: #fff !important;
}
.rb-list-row-acts a.rb-act-on {
  background: #e8f8f4 !important; border-color: #1ab394 !important; color: #1ab394 !important;
}
.rb-list-row-acts a i.fa { width: 14px; text-align: center; font-size: 12px; }

/* Image popup DOWN_IMG — never white-on-white */
.rb-img-page .rb-img-toolbar a.rb-img-dl,
.rb-img-page .rb-img-toolbar .rb-img-dl,
body.rb-img-embed .rb-img-toolbar a.rb-img-dl,
body.rb-img-embed .rb-img-toolbar .rb-img-dl {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  height: 32px !important;
  line-height: 30px !important;
  padding: 0 14px !important;
  margin: 0 !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #1690d8 !important;
  background: #fff !important;
  border: 1px solid #1690d8 !important;
  border-radius: 3px !important;
  text-decoration: none !important;
  box-shadow: none !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}
.rb-img-page .rb-img-toolbar a.rb-img-dl:hover,
body.rb-img-embed .rb-img-toolbar a.rb-img-dl:hover {
  color: #fff !important;
  background: #1690d8 !important;
  border-color: #1690d8 !important;
}
.rb-img-page .rb-img-toolbar a.rb-img-dl i,
body.rb-img-embed .rb-img-toolbar a.rb-img-dl i {
  color: inherit !important;
  font-size: 13px !important;
}
/* override generic btn-default washout */
.rb-img-page .rb-img-toolbar .btn-default,
body.rb-img-embed .rb-img-toolbar .btn-default {
  color: #1690d8 !important;
  background: #fff !important;
  border: 1px solid #1690d8 !important;
}

/* ===== Image lightbox gallery (rb-iv) — inside layer iframe ===== */
body.rb-iv-open { overflow: hidden !important; }
#rb-iv.rb-iv,
.rb-iv {
  position: fixed !important;
  left: 0 !important; top: 0 !important; right: 0 !important; bottom: 0 !important;
  width: 100% !important; height: 100% !important;
  z-index: 2147483000 !important;
  display: none;
  margin: 0 !important; padding: 0 !important;
  box-sizing: border-box !important;
}
.rb-iv-backdrop {
  position: absolute; inset: 0;
  background: rgba(20, 28, 40, 0.72) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  cursor: zoom-out;
}
.rb-iv-main {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  pointer-events: none;
  padding: 52px 60px 48px;
  box-sizing: border-box;
}
.rb-iv-frame {
  flex: 1 1 auto; width: 100%; min-height: 0;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none;
}
.rb-iv-frame img {
  max-width: 100%; max-height: 100%;
  width: auto; height: auto;
  object-fit: contain;
  border-radius: 6px;
  box-shadow: 0 16px 48px rgba(0,0,0,.5);
  background: #0f172a;
  pointer-events: auto;
  transition: opacity .15s ease;
  user-select: none; -webkit-user-drag: none;
}
.rb-iv-bar {
  flex: 0 0 auto; pointer-events: auto;
  display: flex; align-items: center; justify-content: center; gap: 12px;
  margin-top: 12px; color: #e5e7eb; font-size: 13px;
}
.rb-iv-counter {
  font-weight: 700; color: #fff;
  background: rgba(255,255,255,.16);
  padding: 5px 12px; border-radius: 999px; font-size: 12px;
  letter-spacing: .02em;
}
.rb-iv-label {
  max-width: 55vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: #cbd5e1; font-size: 12px; font-family: Consolas, Menlo, monospace;
}
.rb-iv-close {
  position: absolute; top: 10px; right: 12px; z-index: 3;
  width: 42px; height: 42px; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.18); color: #fff;
  font-size: 28px; line-height: 40px; cursor: pointer;
  transition: background .15s;
  padding: 0;
}
.rb-iv-close:hover { background: #ed5565; }
.rb-iv-nav {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  width: 52px; height: 52px; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.2); color: #fff;
  font-size: 26px; line-height: 52px; cursor: pointer;
  transition: background .15s, transform .1s;
  padding: 0; text-align: center;
  box-shadow: 0 4px 16px rgba(0,0,0,.25);
}
.rb-iv-nav:hover { background: #1690d8; transform: translateY(-50%) scale(1.05); }
.rb-iv-prev { left: 10px; }
.rb-iv-next { right: 10px; }
@media (max-width: 640px) {
  .rb-iv-main { padding: 48px 8px 40px; }
  .rb-iv-nav { width: 40px; height: 40px; font-size: 20px; line-height: 40px; }
  .rb-iv-prev { left: 4px; } .rb-iv-next { right: 4px; }
}

/* Plan attachment chips — 舊版橫向排列 + 末端省略；xls 必綠 */
.rb-plan-files {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 4px 6px !important;
  margin-top: 6px !important;
  font-size: 11px !important;
}
a.rb-file-chip,
.rb-file-chip {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  max-width: 240px !important;
  padding: 2px 7px !important;
  border-radius: 3px !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  border: 1px solid transparent !important;
  cursor: pointer !important;
  vertical-align: middle !important;
}
.rb-file-chip i { flex: 0 0 auto !important; }
.rb-file-chip span {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  min-width: 0 !important;
}
a.rb-file-chip.pdf, .rb-file-chip.pdf {
  color: #d9534f !important; background: #fdecee !important; border-color: #f5c6cb !important;
}
a.rb-file-chip.xls, .rb-file-chip.xls {
  color: #3c763d !important; background: #dff0d8 !important; border-color: #c3e6cb !important;
}
a.rb-file-chip.img, .rb-file-chip.img {
  color: #1ab394 !important; background: #e7f7f4 !important; border-color: #b8ebe0 !important;
}
a.rb-file-chip.other, .rb-file-chip.other {
  color: #676a6c !important; background: #f5f5f6 !important; border-color: #e7eaec !important;
}
/* force excel look when path hint present */
a.rb-file-chip[href*="/excel/"],
a.rb-file-chip[data-path*="/excel/"],
a.rb-file-chip[href*=".xls"],
a.rb-file-chip[href*=".xlsx"],
a.rb-file-chip[title*=".xls"],
a.rb-file-chip[title*=".xlsx"] {
  color: #3c763d !important; background: #dff0d8 !important; border-color: #c3e6cb !important;
}
a.rb-file-chip[href*="/pdf/"],
a.rb-file-chip[data-path*="/pdf/"],
a.rb-file-chip[href*=".pdf"],
a.rb-file-chip[title*=".pdf"] {
  color: #d9534f !important; background: #fdecee !important; border-color: #f5c6cb !important;
}

/* ===== Font size grades (S=default/current, M, L) ===== */
html.rb-fs-s, body.rb-fs-s { font-size: 13px; }
html.rb-fs-m, body.rb-fs-m { font-size: 15px; }
html.rb-fs-l, body.rb-fs-l { font-size: 17px; }

/* Content scale — keeps layout, enlarges UI text & controls */
body.rb-fs-s { --rb-ui-scale: 1; }
body.rb-fs-m { --rb-ui-scale: 1.12; }
body.rb-fs-l { --rb-ui-scale: 1.22; }

/* Prefer zoom for whole-page (Chrome/Edge); fallback font on shell */
body.rb-fs-m.rb-topnav,
body.rb-fs-m.gray-bg,
body.rb-fs-m.rb-img-page { zoom: 1.12; }
body.rb-fs-l.rb-topnav,
body.rb-fs-l.gray-bg,
body.rb-fs-l.rb-img-page { zoom: 1.22; }

/* Firefox: no zoom — use text-size-adjust + larger base */
@-moz-document url-prefix() {
  body.rb-fs-m { font-size: 15px !important; }
  body.rb-fs-l { font-size: 17px !important; }
  body.rb-fs-m .rb-menubar > .rb-menu-item > a.rb-menu-btn,
  body.rb-fs-m .rb-menubar .rb-dd a { font-size: 14px !important; }
  body.rb-fs-l .rb-menubar > .rb-menu-item > a.rb-menu-btn,
  body.rb-fs-l .rb-menubar .rb-dd a { font-size: 16px !important; }
  body.rb-fs-m .ibox-title h5,
  body.rb-fs-m .ibox-content,
  body.rb-fs-m table,
  body.rb-fs-m .form-control,
  body.rb-fs-m .btn { font-size: 14px !important; }
  body.rb-fs-l .ibox-title h5,
  body.rb-fs-l .ibox-content,
  body.rb-fs-l table,
  body.rb-fs-l .form-control,
  body.rb-fs-l .btn { font-size: 16px !important; }
}

/* Topbar font switcher (next to EN/繁) */
body.rb-topnav .rb-fs-switch {
  display: inline-flex;
  align-items: center;
  gap: 0;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 3px;
  overflow: hidden;
  margin-right: 8px;
}
body.rb-topnav .rb-fs-switch a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 26px;
  padding: 0 8px;
  font-weight: 700;
  color: rgba(255,255,255,.7) !important;
  text-decoration: none !important;
  background: transparent;
  line-height: 1;
}
body.rb-topnav .rb-fs-switch a:hover {
  color: #fff !important;
  background: rgba(255,255,255,.08);
}
body.rb-topnav .rb-fs-switch a.is-on {
  background: #1690d8;
  color: #fff !important;
}
body.rb-topnav .rb-fs-switch a.rb-fs-a { font-size: 10px; }
body.rb-topnav .rb-fs-switch a.rb-fs-b { font-size: 12px; }
body.rb-topnav .rb-fs-switch a.rb-fs-c { font-size: 14px; }
body.rb-topnav .rb-fs-switch .rb-fs-lab {
  display: none;
}
@media (min-width: 1100px) {
  body.rb-topnav .rb-fs-switch .rb-fs-lab {
    display: inline;
    padding: 0 6px 0 8px;
    font-size: 10px;
    font-weight: 600;
    color: rgba(255,255,255,.45);
    border-right: 1px solid rgba(255,255,255,.15);
    height: 26px;
    line-height: 26px;
  }
}

/* ===== Mobile image layer + gallery v20260801 ===== */
@media (max-width: 768px) {
  /* layer iframe full-screen (rbOpenImgLayer) */
  .layui-layer.layui-layer-iframe {
    max-width: 100vw !important;
    border-radius: 0 !important;
  }
  .layui-layer-shade {
    /* keep dark shade */
  }
  body.rb-img-embed,
  body.rb-img-page {
    min-height: 0 !important;
    height: auto !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    background: #fff !important;
  }
  body.rb-img-embed .wrapper,
  body.rb-img-embed .wrapper-content {
    min-height: 0 !important;
    height: auto !important;
    padding: 8px !important;
    margin: 0 !important;
  }
  body.rb-img-embed .ibox {
    min-height: 0 !important;
  }
  body.rb-img-embed .ibox-title h5 {
    font-size: 12px !important;
  }
  body.rb-img-embed .rb-img-toolbar {
    padding: 8px !important;
    gap: 6px !important;
  }
  /* 2-column photo grid on phone */
  body.rb-img-embed #addimg {
    display: block !important;
    width: 100% !important;
    border-spacing: 0 !important;
  }
  body.rb-img-embed #addimg tbody,
  body.rb-img-embed #addimg tr {
    display: block !important;
    width: 100% !important;
  }
  body.rb-img-embed #addimg td {
    display: inline-block !important;
    width: 48% !important;
    max-width: 48% !important;
    vertical-align: top !important;
    margin: 1% !important;
    box-sizing: border-box !important;
    padding: 6px !important;
  }
  body.rb-img-embed #addimg td img {
    height: 28vw !important;
    max-height: 140px !important;
    min-height: 90px !important;
  }
  /* hide H+ footers if any inside embed */
  body.rb-img-embed .footer,
  body.rb-img-page .footer {
    display: none !important;
  }
}

/* Force layer full-screen on mobile (Shipment Details / JSON log) */
@media (max-width: 768px) {
  .layui-layer.rb-layer-full,
  .layui-layer[rb-full="1"] {
    position: fixed !important;
    left: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100% !important;
    height: 100dvh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
  }
  .layui-layer.rb-layer-full .layui-layer-content,
  .layui-layer[rb-full="1"] .layui-layer-content {
    height: calc(100% - 42px) !important;
    overflow: hidden !important;
    padding: 0 !important;
  }
  .layui-layer.rb-layer-full iframe,
  .layui-layer[rb-full="1"] iframe {
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
  }
}

/* ===== Layer close: MUST sit inside .layui-layer-title (navy bar) =====
   Root cause of "× on white": setwin is a SIBLING of title; absolute top
   drifts under content when height/padding of title/content change.
   Fix: JS moves setwin INTO title; CSS positions relative to title only.
*/

/* kill min / max completely */
body .layui-layer .layui-layer-setwin .layui-layer-min,
body .layui-layer .layui-layer-setwin .layui-layer-max,
body .layui-layer .layui-layer-setwin .layui-layer-maxmin {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  background: none !important;
}

/* Title is positioning context for close */
body .layui-layer .layui-layer-title {
  height: 48px !important;
  line-height: 48px !important;
  padding: 0 52px 0 16px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  position: relative !important;
}

/* When setwin is still a sibling (before JS / fallback): pin to layer top */
body .layui-layer > .layui-layer-setwin {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  left: auto !important;
  bottom: auto !important;
  width: 48px !important;
  height: 48px !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  z-index: 50 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  float: none !important;
}

/* When setwin is moved inside title (preferred) */
body .layui-layer .layui-layer-title > .layui-layer-setwin {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  left: auto !important;
  bottom: auto !important;
  width: 48px !important;
  height: 100% !important; /* exactly title height — never into content */
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  z-index: 50 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  float: none !important;
}

/* Hide every setwin link by default */
body .layui-layer .layui-layer-setwin a {
  display: none !important;
  float: none !important;
  position: static !important; /* override .layui-layer-close{position:absolute} */
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 0 !important;
  height: 0 !important;
  background: none !important;
  background-image: none !important;
  filter: none !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 0 !important;
  line-height: 0 !important;
  opacity: 0 !important;
}

/* Only close is visible — flex child of setwin, no absolute offsets */
body .layui-layer .layui-layer-setwin a.layui-layer-close1,
body .layui-layer .layui-layer-setwin a.layui-layer-close2,
body .layui-layer .layui-layer-setwin .layui-layer-close1,
body .layui-layer .layui-layer-setwin .layui-layer-close2 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: static !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  width: 34px !important;
  height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 6px !important;
  background: rgba(255, 255, 255, 0.18) !important;
  background-image: none !important;
  background-position: 0 0 !important;
  color: #fff !important;
  opacity: 1 !important;
  filter: none !important;
  font-size: 0 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  vertical-align: middle !important;
  -webkit-tap-highlight-color: transparent;
}

body .layui-layer .layui-layer-setwin a.layui-layer-close1:hover,
body .layui-layer .layui-layer-setwin .layui-layer-close1:hover {
  background: rgba(255, 255, 255, 0.32) !important;
  opacity: 1 !important;
}

/* Kill sprite pseudo + draw white × INSIDE the button */
body .layui-layer .layui-layer-setwin .layui-layer-close1::before,
body .layui-layer .layui-layer-setwin .layui-layer-close2::before {
  content: none !important;
  display: none !important;
}
body .layui-layer .layui-layer-setwin .layui-layer-close1::after,
body .layui-layer .layui-layer-setwin .layui-layer-close2::after {
  content: "\00d7" !important;
  display: block !important;
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  font-family: Arial, Helvetica, sans-serif !important;
  background: none !important;
  pointer-events: none !important;
}

/* Navy title always */
body .layui-layer.rb-layer .layui-layer-title,
body .layui-layer.rb-layer-full .layui-layer-title,
body .layui-layer[rb-full="1"] .layui-layer-title {
  background: #2f4050 !important;
  color: #fff !important;
  border: 0 !important;
  height: 48px !important;
  line-height: 48px !important;
  padding-right: 52px !important;
  padding-left: 16px !important;
}

/* Air inbound list — Split icon button */
a.rb-ico-btn.rb-ico-split {
  color: #1690d8 !important;
  border-color: rgba(22,144,216,.4) !important;
  background: #e8f4fb !important;
}
a.rb-ico-btn.rb-ico-split:hover {
  background: #1690d8 !important;
  color: #fff !important;
  border-color: #1690d8 !important;
}
a.rb-ico-btn.rb-ico-split i.fa {
  font-family: FontAwesome !important;
  font-style: normal !important;
}
.rb-split-tag i.fa {
  font-family: FontAwesome !important;
  margin-right: 3px;
}