/* Serial No. Management: phone/APK presentation only. Desktop rules stay in styles.css. */
.serial-purchase-mobile-stepper,
.serial-purchase-mobile-review,
.serial-purchase-mobile-actions,
.serial-purchase-mobile-success,
.serial-purchase-mobile-summary-preview {
  display: none;
}

.serial-sale-mobile-only {
  display: none;
}

.serial-records-mobile-header,
.serial-mobile-product-card,
.serial-mobile-status-chips,
.serial-mobile-list-heading,
.serial-mobile-overlay,
.serial-mobile-details,
.serial-mobile-bulk-bar,
.serial-mobile-context,
.serial-mobile-menu-only {
  display: none;
}

.serial-records-mobile-header,
.serial-mobile-product-card,
.serial-mobile-status-chips,
.serial-mobile-list-heading,
.serial-mobile-overlay,
.serial-mobile-details,
.serial-mobile-bulk-bar,
.serial-mobile-context {
  display: none;
}

@media (max-width: 720px) {
  #tab-serial-home,
  #tab-serials,
  #tab-serial-records,
  #tab-serial-incoming,
  #tab-serial-vouchers {
    --serial-mobile-ink: #0d1b3e;
    --serial-mobile-muted: #63708f;
    --serial-mobile-line: #e2e8f4;
    --serial-mobile-blue: #1264e8;
    --serial-mobile-surface: #ffffff;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: visible;
    color: var(--serial-mobile-ink);
  }

  #tab-serial-home *,
  #tab-serials *,
  #tab-serial-records *,
  #tab-serial-incoming *,
  #tab-serial-vouchers * {
    box-sizing: border-box;
    min-width: 0;
  }

  #tab-serial-home .serial-home-dashboard,
  #tab-serial-home .payment-home-main,
  #tab-serial-home .serial-home-body,
  #tab-serial-home .serial-home-content-grid,
  #tab-serial-home .serial-home-left-stack,
  #tab-serial-home .serial-home-side-grid {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #tab-serial-home .serial-home-dashboard {
    display: block;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  #tab-serial-home .payment-home-sidebar {
    display: none !important;
  }

  #tab-serial-home .serial-home-body {
    display: grid;
    gap: 14px;
    padding: 12px 12px 92px;
    background: linear-gradient(180deg, #f2f7ff 0%, #f8faff 46%, #f5f7fb 100%);
  }

  #tab-serial-home .serial-home-heading-row {
    position: relative;
    display: block;
    min-height: 154px;
    padding: 22px 20px;
    overflow: hidden;
    border: 0;
    border-radius: 24px;
    background:
      radial-gradient(circle at 88% 22%, rgba(255,255,255,.25) 0 18px, transparent 19px),
      radial-gradient(circle at 93% 52%, rgba(255,255,255,.12) 0 45px, transparent 46px),
      linear-gradient(138deg, #0f459c 0%, #1264e8 58%, #20a9c8 100%);
    box-shadow: 0 18px 36px rgba(22, 83, 174, .2);
  }

  #tab-serial-home .serial-home-heading-row::before {
    content: "▥";
    position: absolute;
    right: 22px;
    bottom: 17px;
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border: 1px solid rgba(255,255,255,.38);
    border-radius: 18px;
    background: rgba(255,255,255,.18);
    color: #fff;
    font-family: inherit;
    font-weight: 800;
    font-size: 28px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.3);
  }

  #tab-serial-home .serial-home-heading-row::after {
    content: "SERIAL INVENTORY";
    position: absolute;
    left: 20px;
    top: 18px;
    color: rgba(255,255,255,.78);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
  }

  #tab-serial-home .serial-home-heading-row h1 {
    max-width: 245px;
    margin: 24px 0 7px;
    color: #fff;
    font-size: 26px;
    line-height: 1.08;
    letter-spacing: -.035em;
  }

  #tab-serial-home .serial-home-heading-row p {
    max-width: 245px;
    margin: 0;
    color: rgba(255,255,255,.86);
    font-size: 13px;
    line-height: 1.45;
  }

  #tab-serial-home .serial-home-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
  }

  #tab-serial-home .serial-home-stat-grid .payment-home-stat-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-height: 108px;
    padding: 13px;
    border: 1px solid var(--serial-mobile-line);
    border-radius: 18px;
    box-shadow: 0 10px 24px rgba(31, 55, 104, .07);
  }

  #tab-serial-home .serial-home-stat-grid .payment-home-stat-card:last-child {
    grid-column: 1 / -1;
    min-height: 82px;
  }

  #tab-serial-home .payment-home-stat-icon {
    width: 42px;
    height: 42px;
    border-radius: 13px;
    font-size: 18px;
  }

  #tab-serial-home .payment-home-stat-card small,
  #tab-serial-home .payment-home-stat-card span.is-muted {
    display: block;
    overflow: hidden;
    font-size: 10px;
    line-height: 1.25;
    text-overflow: ellipsis;
  }

  #tab-serial-home .payment-home-stat-card small {
    white-space: nowrap;
  }

  #tab-serial-home .payment-home-stat-card span.is-muted {
    display: -webkit-box;
    overflow: hidden;
    white-space: normal;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  #tab-serial-home .payment-home-stat-card small {
    color: #53617f;
    font-weight: 750;
  }

  #tab-serial-home .payment-home-stat-card strong {
    display: block;
    margin: 2px 0;
    font-size: 26px;
    line-height: 1;
  }

  #tab-serial-home .serial-home-content-grid,
  #tab-serial-home .serial-home-left-stack,
  #tab-serial-home .serial-home-side-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
  }

  #tab-serial-home .payment-home-card {
    padding: 14px;
    border: 1px solid var(--serial-mobile-line);
    border-radius: 20px;
    background: var(--serial-mobile-surface);
    box-shadow: 0 10px 26px rgba(31, 55, 104, .06);
  }

  #tab-serial-home .payment-home-section-head {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 11px;
  }

  #tab-serial-home .payment-home-section-head h2 {
    margin: 0;
    color: var(--serial-mobile-ink);
    font-size: 18px;
  }

  #tab-serial-home .payment-home-link-btn {
    min-height: 34px;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 11px;
  }

  #tab-serial-home .serial-home-action-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
  }

  #tab-serial-home .serial-home-action-grid .replacement-home-action-tile {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 11px;
    width: 100%;
    min-height: 78px;
    padding: 11px 12px;
    border: 1px solid #e4e9f4;
    border-radius: 16px;
    background: #fff;
    text-align: left;
    box-shadow: none;
  }

  #tab-serial-home .serial-home-action-grid .replacement-home-action-icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    font-size: 20px;
  }

  #tab-serial-home .serial-home-action-grid .replacement-home-action-copy {
    display: block;
    overflow: hidden;
  }

  #tab-serial-home .serial-home-action-grid .replacement-home-action-copy strong {
    display: block;
    color: var(--serial-mobile-ink);
    font-size: 14px;
    line-height: 1.25;
  }

  #tab-serial-home .serial-home-action-grid .replacement-home-action-copy small {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: var(--serial-mobile-muted);
    font-size: 11px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #tab-serial-home .serial-home-action-grid .replacement-home-action-tile > .bi-chevron-right {
    color: #71809d;
    font-size: 14px;
  }

  #tab-serial-home .payment-home-table-wrap {
    width: 100%;
    overflow: hidden;
    border: 0;
    border-radius: 0;
  }

  #tab-serial-home .serial-home-low-stock-card table,
  #tab-serial-home .serial-home-low-stock-card tbody,
  #tab-serial-home .serial-home-low-stock-card tr {
    display: block;
    width: 100%;
  }

  #tab-serial-home .serial-home-low-stock-card thead {
    display: none;
  }

  #tab-serial-home .serial-home-low-stock-card tbody {
    display: grid;
    gap: 8px;
  }

  #tab-serial-home .serial-home-low-stock-card tbody tr {
    padding: 10px 11px;
    border: 1px solid #e8edf5;
    border-radius: 14px;
    background: #f9fbff;
  }

  #tab-serial-home .serial-home-low-stock-card tbody td {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    gap: 8px;
    padding: 5px 0;
    border: 0;
    font-size: 12px;
    text-align: right;
  }

  #tab-serial-home .serial-home-low-stock-card tbody td::before {
    color: var(--serial-mobile-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .04em;
    text-align: left;
    text-transform: uppercase;
  }

  #tab-serial-home .serial-home-low-stock-card tbody td:nth-child(1)::before { content: "Product"; }
  #tab-serial-home .serial-home-low-stock-card tbody td:nth-child(2)::before { content: "Available"; }
  #tab-serial-home .serial-home-low-stock-card tbody td:nth-child(3)::before { content: "Threshold"; }
  #tab-serial-home .serial-home-low-stock-card tbody td:nth-child(4)::before { content: "Status"; }

  #tab-serial-home .serial-home-low-stock-card tbody td[colspan] {
    display: block;
    padding: 0;
    text-align: center;
  }

  #tab-serial-home .serial-home-low-stock-card tbody td[colspan]::before {
    display: none;
  }

  #tab-serial-home .serial-home-side-grid {
    display: none;
  }

  /* Shared phone shell for every Serial sub-page. */
  #tab-serials > .panel-card,
  #tab-serial-records > .panel-card,
  #tab-serial-incoming > .panel-card,
  #tab-serial-vouchers > .panel-card {
    width: 100%;
    min-width: 0;
    margin: 0;
    padding: 12px 12px 92px;
    border: 0;
    border-radius: 0;
    background: linear-gradient(180deg, #f3f7ff, #f7f9fd);
    box-shadow: none;
  }

  #tab-serials > .panel-card > .panel-heading,
  #tab-serial-records > .panel-card > .panel-heading,
  #tab-serial-incoming > .panel-card > .panel-heading,
  #tab-serial-vouchers > .panel-card > .panel-heading {
    display: grid;
    grid-template-columns: 1fr;
    gap: 13px;
    align-items: stretch;
    margin: 0 0 12px;
    padding: 18px;
    border: 0;
    border-radius: 22px;
    background: linear-gradient(140deg, #0e3e91, #1264e8 64%, #1fa3c6);
    box-shadow: 0 16px 34px rgba(22, 83, 174, .18);
  }

  #tab-serials > .panel-card > .panel-heading .eyebrow,
  #tab-serial-records > .panel-card > .panel-heading .eyebrow,
  #tab-serial-incoming > .panel-card > .panel-heading .eyebrow,
  #tab-serial-vouchers > .panel-card > .panel-heading .eyebrow {
    color: rgba(255,255,255,.72);
    font-size: 10px;
    letter-spacing: .14em;
  }

  #tab-serials > .panel-card > .panel-heading h2,
  #tab-serial-records > .panel-card > .panel-heading h2,
  #tab-serial-incoming > .panel-card > .panel-heading h2,
  #tab-serial-vouchers > .panel-card > .panel-heading h2 {
    margin: 2px 0 0;
    color: #fff;
    font-size: 21px;
    line-height: 1.2;
    letter-spacing: -.025em;
  }

  #tab-serials > .panel-card > .panel-heading .helper-text,
  #tab-serial-records > .panel-card > .panel-heading .helper-text,
  #tab-serial-incoming > .panel-card > .panel-heading .helper-text,
  #tab-serial-vouchers > .panel-card > .panel-heading .helper-text {
    color: rgba(255,255,255,.8);
  }

  #tab-serials > .panel-card > .panel-heading p:not(.eyebrow),
  #tab-serial-records > .panel-card > .panel-heading p:not(.eyebrow),
  #tab-serial-incoming > .panel-card > .panel-heading p:not(.eyebrow),
  #tab-serial-vouchers > .panel-card > .panel-heading p:not(.eyebrow) {
    color: rgba(255,255,255,.82);
  }

  #tab-serials > .panel-card > .panel-heading .action-cluster,
  #tab-serial-records > .panel-card > .panel-heading .action-cluster,
  #tab-serial-incoming > .panel-card > .panel-heading .action-cluster,
  #tab-serial-vouchers > .panel-card > .panel-heading .action-cluster {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    width: 100%;
  }

  #tab-serials > .panel-card > .panel-heading .secondary-btn,
  #tab-serial-records > .panel-card > .panel-heading .secondary-btn,
  #tab-serial-incoming > .panel-card > .panel-heading .secondary-btn,
  #tab-serial-vouchers > .panel-card > .panel-heading .secondary-btn {
    width: 100%;
    min-height: 42px;
    border-color: rgba(255,255,255,.3);
    background: rgba(255,255,255,.15);
    color: #fff;
  }

  #tab-serials > .panel-card > .panel-heading .status-pill,
  #tab-serial-records > .panel-card > .panel-heading .status-pill,
  #tab-serial-incoming > .panel-card > .panel-heading .status-pill,
  #tab-serial-vouchers > .panel-card > .panel-heading .status-pill {
    display: none;
  }

  /* Purchase and sale entry become compact native-style wizards. */
  #tab-serials .serial-workflow-grid,
  #tab-serials .serial-workflow-card,
  #tab-serials .serial-view-panel,
  #tab-serials .serial-purchase-page,
  #tab-serials .serial-sale-page,
  #tab-serials .serial-inventory-dashboard {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  #tab-serials .serial-workflow-grid {
    display: block;
  }

  #tab-serials .serial-workflow-card,
  #tab-serials .serial-inventory-dashboard {
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  #tab-serials .serial-purchase-hero,
  #tab-serials .serial-inventory-hero {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 16px;
    border: 1px solid #dfe7f4;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(31, 55, 104, .06);
  }

  #tab-serials .serial-purchase-title {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 11px;
  }

  #tab-serials .serial-purchase-title-icon {
    width: 48px;
    height: 48px;
    border-radius: 15px;
  }

  #tab-serials .serial-purchase-title h3,
  #tab-serials .serial-inventory-title-block h3 {
    font-size: 20px;
    line-height: 1.2;
  }

  #tab-serials .serial-purchase-title p,
  #tab-serials .serial-inventory-title-block p {
    font-size: 12px;
    line-height: 1.4;
  }

  #tab-serials .serial-purchase-steps,
  #tab-serials .serial-sale-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
  }

  #tab-serials .serial-purchase-steps li,
  #tab-serials .serial-sale-steps li {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    gap: 4px;
    padding: 7px 3px;
    border-radius: 12px;
    background: #f3f6fb;
    text-align: center;
  }

  #tab-serials .serial-purchase-steps li::before,
  #tab-serials .serial-sale-steps li::before {
    display: none;
  }

  #tab-serials .serial-purchase-steps span,
  #tab-serials .serial-sale-steps span {
    width: 26px;
    height: 26px;
    font-size: 11px;
  }

  #tab-serials .serial-purchase-steps strong,
  #tab-serials .serial-sale-steps strong {
    font-size: 9px;
    line-height: 1.2;
  }

  #tab-serials .serial-purchase-main,
  #tab-serials .serial-purchase-left,
  #tab-serials .serial-purchase-side,
  #tab-serials .serial-purchase-grid,
  #tab-serials .serial-purchase-grid-primary,
  #tab-serials .serial-sale-details-grid,
  #tab-serials .serial-inventory-content-grid,
  #tab-serials .serial-inventory-search-grid,
  #tab-serials .serial-inventory-kpis,
  #tab-serials .serial-inventory-summary-strip {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    width: 100%;
  }

  #tab-serials .serial-purchase-main {
    margin-top: 12px;
  }

  #tab-serials .serial-purchase-section,
  #tab-serials .serial-purchase-summary-panel,
  #tab-serials .serial-purchase-ready-panel,
  #tab-serials .serial-purchase-preview-panel,
  #tab-serials .serial-sale-help-panel,
  #tab-serials .serial-sale-quick-panel,
  #tab-serials .serial-inventory-search-card,
  #tab-serials .serial-inventory-table-card,
  #tab-serials .serial-home-product-card {
    width: 100%;
    padding: 14px;
    border: 1px solid #e1e7f1;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(31, 55, 104, .05);
  }

  #tab-serials .serial-purchase-entry-tabs,
  #tab-serials .serial-sale-entry-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    padding: 4px;
    border-radius: 13px;
    background: #eef2f8;
  }

  #tab-serials .serial-purchase-entry-tabs button,
  #tab-serials .serial-sale-entry-tabs button {
    min-height: 40px;
    padding: 7px;
    border: 0;
    border-radius: 10px;
    font-size: 11px;
  }

  #tab-serials .serial-purchase-dropzone,
  #tab-serials .serial-sale-dropzone {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    width: 100%;
    padding: 14px;
    text-align: center;
  }

  #tab-serials .serial-purchase-actionbar,
  #tab-serials .serial-sale-actionbar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    width: 100%;
    margin-top: 12px;
    padding: 12px;
    border-radius: 18px;
  }

  #tab-serials .serial-purchase-actions,
  #tab-serials .serial-purchase-actions .primary-btn,
  #tab-serials .serial-purchase-actions .secondary-btn,
  #tab-serials .serial-inventory-toolbar,
  #tab-serials .serial-inventory-search-actions,
  #tab-serials .serial-view-summary-actions {
    width: 100%;
  }

  #tab-serials .serial-purchase-actions,
  #tab-serials .serial-inventory-search-actions,
  #tab-serials .serial-view-summary-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  #tab-serials input,
  #tab-serials select,
  #tab-serials textarea,
  #tab-serials .searchable-select-input,
  #tab-serial-records input,
  #tab-serial-records select,
  #tab-serial-vouchers input,
  #tab-serial-vouchers select,
  #tab-serial-vouchers textarea,
  #tab-serial-incoming input,
  #tab-serial-incoming select {
    max-width: 100%;
    font-size: 16px !important;
  }

  /* Inventory summary and voucher registers become readable cards. */
  #tab-serials .serial-home-product-table-wrap,
  #tab-serial-vouchers .serial-voucher-table-wrap,
  #tab-serial-incoming .replacement-incoming-table-wrap {
    width: 100%;
    overflow: visible;
    border: 0;
    background: transparent;
  }

  #tab-serials .serial-home-product-table,
  #tab-serials .serial-home-product-table tbody,
  #tab-serials .serial-home-product-table tr,
  #tab-serial-vouchers .serial-voucher-table,
  #tab-serial-vouchers .serial-voucher-table tbody,
  #tab-serial-vouchers .serial-voucher-table tr,
  #tab-serial-incoming .replacement-incoming-table-wrap table,
  #tab-serial-incoming .replacement-incoming-table-wrap tbody,
  #tab-serial-incoming .replacement-incoming-table-wrap tr {
    display: block;
    width: 100%;
    min-width: 0;
  }

  #tab-serials .serial-home-product-table thead,
  #tab-serial-vouchers .serial-voucher-table thead,
  #tab-serial-incoming .replacement-incoming-table-wrap thead {
    display: none;
  }

  #tab-serials .serial-home-product-table tbody,
  #tab-serial-vouchers .serial-voucher-table tbody,
  #tab-serial-incoming .replacement-incoming-table-wrap tbody {
    display: grid;
    gap: 10px;
  }

  #tab-serials .serial-home-product-table tbody tr,
  #tab-serial-vouchers .serial-voucher-table tbody tr,
  #tab-serial-incoming .replacement-incoming-table-wrap tbody tr {
    padding: 12px;
    border: 1px solid #e1e7f1;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 7px 18px rgba(31, 55, 104, .05);
  }

  #tab-serials .serial-home-product-table tbody td,
  #tab-serial-vouchers .serial-voucher-table tbody td,
  #tab-serial-incoming .replacement-incoming-table-wrap tbody td {
    display: block;
    width: 100% !important;
    max-width: 100%;
    padding: 6px 0;
    border: 0;
    white-space: normal;
    text-align: left;
    overflow-wrap: anywhere;
  }

  /* Serial inventory: keep desktop table semantics, but present each row as a compact APK card. */
  #tab-serials #serialInventoryDashboard .serial-inventory-hero {
    gap: 12px;
    padding: 16px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-breadcrumb {
    margin-bottom: 5px;
    font-size: 10px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-title-block h2 {
    margin: 0;
    font-size: 23px;
    line-height: 1.16;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-title-block p {
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.45;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-summary-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-summary-strip article {
    min-height: 66px;
    padding: 10px 11px;
    border-radius: 13px;
    background: #f6f9ff;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-summary-strip article:first-child {
    display: flex;
    grid-column: 1 / -1;
    align-items: center;
    justify-content: space-between;
    min-height: 48px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-summary-strip article:first-child strong {
    margin-top: 0;
    text-align: right;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-search-card,
  #tab-serials #serialInventoryDashboard .serial-inventory-table-card {
    padding: 13px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-section-head {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-search-heading {
    flex: 1 1 auto;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-search-heading .helper-text {
    display: none;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-refresh-btn {
    width: 42px;
    min-height: 42px !important;
    padding: 0 !important;
    border-radius: 12px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-refresh-btn span {
    display: none;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-search-grid {
    gap: 9px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-field {
    gap: 5px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-field input {
    min-height: 45px;
    padding: 10px 12px;
    border-radius: 12px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-search-actions {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-search-actions > button {
    width: 100%;
    min-height: 43px;
    padding-inline: 8px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-kpi {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 9px;
    min-height: 76px;
    padding: 11px;
    border-radius: 15px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-kpi-icon {
    grid-row: 1 / 3;
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-kpi strong {
    align-self: end;
    font-size: 20px;
    line-height: 1;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-kpi small {
    align-self: start;
    margin-top: 4px;
    font-size: 10px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-mini-progress {
    display: none;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-table-head {
    align-items: flex-start;
    margin-bottom: 10px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-table-head > div:first-child {
    flex: 1 1 auto;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-table-head .helper-text {
    margin-top: 4px;
    font-size: 10px;
    line-height: 1.35;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-table-head .serial-inventory-toolbar {
    display: grid;
    grid-template-columns: repeat(3, 36px);
    flex: 0 0 auto;
    width: auto;
    gap: 5px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-table-head .serial-inventory-toolbar > button {
    width: 36px;
    min-height: 36px;
    padding: 0;
    border-radius: 10px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-table-head .serial-inventory-toolbar > button span,
  #tab-serials #serialInventoryDashboard .serial-column-chooser {
    display: none;
  }

  #tab-serials #serialInventoryDashboard .serial-product-filter-chips {
    display: flex;
    flex-wrap: nowrap;
    gap: 7px;
    margin: 0 -13px 10px;
    padding: 0 13px 3px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  #tab-serials #serialInventoryDashboard .serial-product-filter-chips::-webkit-scrollbar {
    display: none;
  }

  #tab-serials #serialInventoryDashboard .serial-product-filter-chip {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 7px 11px;
    font-size: 11px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-sync-line {
    display: block;
    margin-bottom: 9px;
    font-size: 10px;
  }

  #tab-serials #serialInventoryDashboard .serial-inventory-sync-line .status-pill {
    display: none;
  }

  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody {
    gap: 11px;
  }

  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody tr {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 12px 10px 9px;
    overflow: visible;
    border-radius: 16px;
  }

  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td {
    position: static;
    display: grid;
    width: auto !important;
    min-width: 0;
    padding: 7px 2px;
    background: transparent;
    text-align: center;
  }

  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:first-child {
    display: block;
    grid-column: 1 / -1;
    margin-bottom: 2px;
    padding: 0 42px 10px 0;
    border-bottom: 1px solid #edf1f7;
    text-align: left;
  }

  #tab-serials #serialInventoryDashboard .serial-product-cell {
    gap: 9px;
  }

  #tab-serials #serialInventoryDashboard .serial-product-avatar {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  #tab-serials #serialInventoryDashboard .serial-product-cell strong {
    padding-right: 2px;
    font-size: 13px;
    line-height: 1.25;
  }

  #tab-serials #serialInventoryDashboard .serial-product-cell small {
    font-size: 10px;
  }

  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:nth-child(n + 2):nth-child(-n + 8)::before {
    display: block;
    margin-bottom: 5px;
    color: #77839a;
    font-size: 8px;
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
    text-transform: uppercase;
  }

  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:nth-child(2)::before { content: "Total"; }
  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:nth-child(3)::before { content: "Available"; }
  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:nth-child(4)::before { content: "Assigned"; }
  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:nth-child(5)::before { content: "Replaced"; }
  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:nth-child(6)::before { content: "Returned"; }
  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:nth-child(7)::before { content: "Defective"; }
  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:nth-child(8)::before { content: "Attention"; }

  #tab-serials #serialInventoryDashboard .serial-product-count-btn,
  #tab-serials #serialInventoryDashboard .serial-product-count-btn.is-empty {
    min-width: 36px;
    height: 28px;
    margin-inline: auto;
    font-size: 11px;
  }

  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td:last-child {
    position: absolute;
    top: 12px;
    right: 10px;
    display: block;
    width: 36px !important;
    padding: 0;
  }

  #tab-serials #serialInventoryDashboard .serial-product-action-menu summary,
  #tab-serials #serialInventoryDashboard .serial-product-more-btn {
    width: 36px;
    height: 36px;
  }

  #tab-serials #serialInventoryDashboard .serial-product-action-list {
    right: 0;
    min-width: 190px;
  }

  #tab-serials #serialInventoryDashboard .serial-product-empty-state {
    grid-column: 1 / -1;
    padding: 24px 12px;
  }

  #tab-serials #serialInventoryDashboard .serial-home-product-table tbody td[colspan] {
    position: static;
    display: block;
    grid-column: 1 / -1;
    width: 100% !important;
    padding: 0;
  }

  #tab-serials #serialInventoryDashboard .serial-product-pagination-bar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-top: 12px;
  }

  #tab-serials #serialInventoryDashboard .serial-product-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
  }

  #tab-serials #serialInventoryDashboard .serial-product-pagination button {
    min-height: 36px;
  }

  #tab-serials #serialInventoryDashboard .serial-view-summary-actions {
    margin-top: 11px;
  }

  #tab-serials #serialInventoryDashboard .serial-view-summary-actions .primary-btn {
    min-height: 46px;
  }

  #tab-serial-vouchers .serial-voucher-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-bottom: 12px;
  }

  #tab-serial-vouchers .serial-voucher-stat-grid article {
    min-height: 84px;
    padding: 11px;
    border-radius: 16px;
  }

  #tab-serial-vouchers .serial-voucher-stat-grid article > span {
    width: 38px;
    height: 38px;
    border-radius: 12px;
  }

  #tab-serial-vouchers .serial-voucher-stat-grid small { font-size: 9px; }
  #tab-serial-vouchers .serial-voucher-stat-grid strong { font-size: 21px; }

  #tab-serial-vouchers .serial-voucher-list-card {
    padding: 13px;
    border-radius: 18px;
  }

  #tab-serial-vouchers .serial-voucher-toolbar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  #tab-serial-vouchers .serial-voucher-pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 6px;
  }

  #tab-serial-vouchers .serial-voucher-pagination button {
    min-width: 0;
    padding-inline: 8px;
  }

  /* Existing serial-record row renderer already provides semantic cells; this finishes the phone card layout. */
  #tab-serial-records .serial-listing-page,
  #tab-serial-records .serial-records-panel,
  #tab-serial-records .serial-records-row,
  #tab-serial-records .serial-secondary-filter-grid,
  #tab-serial-records .serial-records-row-actions,
  #tab-serial-records .serial-bulk-actions-row,
  #tab-serial-records .serial-b2b-sync-row {
    width: 100%;
    min-width: 0;
  }

  #tab-serial-records .serial-listing-page .serial-records-panel {
    padding: 12px;
    border-radius: 18px;
    background: #fff;
  }

  #tab-serial-records .serial-listing-header .action-cluster,
  #tab-serial-records .serial-records-row-filters,
  #tab-serial-records .serial-secondary-filter-grid,
  #tab-serial-records .serial-records-row-actions,
  #tab-serial-records .serial-bulk-actions-row,
  #tab-serial-records .serial-b2b-sync-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  #tab-serial-records .serial-listing-header .action-cluster > *,
  #tab-serial-records .serial-records-row-actions button,
  #tab-serial-records .serial-bulk-actions-row button,
  #tab-serial-records .serial-b2b-sync-row button {
    width: 100%;
  }

  #tab-serial-records .serial-insights {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  #tab-serial-records .serial-list-card-table,
  #tab-serial-records .serial-main-table {
    width: 100%;
    min-width: 0;
    overflow: visible;
  }

  #tab-serial-records .serial-list-card-table tbody tr.serial-card-row {
    border-radius: 16px;
    box-shadow: 0 8px 20px rgba(31, 55, 104, .05);
  }

  #tab-serial-records .serial-list-footer {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
  }

  #tab-serial-records .serial-list-pagination {
    justify-content: center;
  }

  #tab-serial-records .serial-status-legend {
    gap: 8px 12px;
    padding: 10px;
    border-radius: 14px;
  }

  /* Partner incoming inbox keeps its three levels but removes desktop-width tables. */
  #tab-serial-incoming .serial-home-incoming-panel {
    width: 100%;
    padding: 13px;
    border-radius: 18px;
    background: #fff;
  }

  #tab-serial-incoming .replacement-incoming-heading,
  #tab-serial-incoming .serial-b2b-incoming-nav,
  #tab-serial-incoming .serial-b2b-approve-meta-grid,
  #tab-serial-incoming .replacement-b2b-item-map-wrap {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    width: 100%;
  }

  #tab-serial-incoming .serial-b2b-incoming-nav button,
  #tab-serial-incoming .serial-b2b-product-map-box button {
    width: 100%;
  }

  #tab-serial-incoming .serial-b2b-incoming-context {
    padding: 8px 10px;
    border-radius: 10px;
    background: #edf4ff;
    color: #245fc5;
    font-size: 11px;
    font-weight: 750;
  }

  /* Serial editors behave as bottom sheets inside the APK. */
  .serial-series-dialog,
  .serial-manual-dialog,
  .serial-bulk-edit-dialog,
  #tab-serial-vouchers .serial-voucher-editor-card {
    width: 100%;
    max-width: 100%;
    max-height: 88dvh;
    margin: 0;
    overflow: auto;
    border-radius: 22px 22px 0 0;
  }

  .serial-voucher-editor-overlay,
  .dialog-overlay:has(.serial-series-dialog),
  .dialog-overlay:has(.serial-manual-dialog),
  .dialog-overlay:has(.serial-bulk-edit-dialog) {
    align-items: flex-end;
    padding: 0;
  }

  .serial-series-grid,
  .serial-series-fields,
  .serial-manual-dialog .form-grid,
  .serial-bulk-edit-dialog .form-grid,
  #tab-serial-vouchers .serial-voucher-editor-card .form-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .serial-series-actions,
  .serial-manual-dialog .action-row,
  .serial-bulk-edit-dialog .action-row,
  #tab-serial-vouchers .serial-voucher-editor-card .action-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .serial-series-actions > *,
  .serial-manual-dialog .action-row > *,
  .serial-bulk-edit-dialog .action-row > *,
  #tab-serial-vouchers .serial-voucher-editor-card .action-row > * {
    width: 100%;
  }

  /* Purchase Inward is a five-step APK flow; desktop keeps the original full form. */
  #tab-serials #serialPurchasePanel .serial-purchase-desktop-lifecycle,
  #tab-serials #serialB2BWarrantyPanel,
  #tab-serials .serial-sale-b2b-warranty-note {
    display: none !important;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-hero {
    position: sticky;
    top: 0;
    z-index: 8;
    gap: 12px;
    margin: 0 -12px;
    padding: 12px 12px 10px;
    border: 0;
    border-bottom: 1px solid #dfe6f2;
    border-radius: 0;
    box-shadow: 0 6px 18px rgba(31, 55, 104, .08);
  }

  #tab-serials #serialPurchasePanel .serial-purchase-title {
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-title-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-title h3 {
    font-size: 19px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-title p {
    display: none;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li {
    position: relative;
    min-width: 0;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li::before {
    content: "";
    position: absolute;
    top: 13px;
    left: 0;
    width: 50%;
    height: 2px;
    background: #d9e1ee;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li::after {
    content: "";
    position: absolute;
    top: 13px;
    right: 0;
    width: 50%;
    height: 2px;
    background: #d9e1ee;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li:first-child::before,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li:last-child::after {
    display: none;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-complete::before,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-complete::after,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-active::before {
    background: #1264e8;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper button {
    position: relative;
    z-index: 1;
    display: grid;
    justify-items: center;
    gap: 5px;
    width: 100%;
    min-height: 52px;
    padding: 0 1px;
    border: 0;
    background: transparent;
    color: #6b7893;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper span {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border: 2px solid #d6deeb;
    border-radius: 50%;
    background: #fff;
    color: #64718d;
    font-size: 11px;
    font-weight: 850;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper strong {
    color: inherit;
    font-size: 8px;
    line-height: 1.15;
    text-align: center;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-active button,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-complete button {
    color: #0d54c7;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-active span,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-complete span {
    border-color: #1264e8;
    background: #1264e8;
    color: #fff;
    box-shadow: 0 4px 10px rgba(18, 100, 232, .22);
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-complete span {
    font-size: 0;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-stepper li.is-complete span::after {
    content: "✓";
    font-size: 13px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-main {
    display: block;
    margin-top: 12px;
  }

  #tab-serials #serialPurchasePanel [data-serial-purchase-step-panel]:not(.is-mobile-step-active) {
    display: none !important;
  }

  #tab-serials #serialPurchasePanel [data-serial-purchase-step-panel].is-mobile-step-active {
    width: 100%;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-left,
  #tab-serials #serialPurchasePanel .serial-purchase-side {
    display: contents;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-section,
  #tab-serials #serialPurchasePanel .serial-purchase-summary-panel,
  #tab-serials #serialPurchasePanel .serial-purchase-ready-panel,
  #tab-serials #serialPurchasePanel .serial-purchase-preview-panel {
    padding: 15px;
    border-radius: 16px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-section h4,
  #tab-serials #serialPurchasePanel .serial-purchase-summary-panel h4,
  #tab-serials #serialPurchasePanel .serial-purchase-preview-panel h4 {
    margin: 0 0 14px;
    font-size: 16px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-grid,
  #tab-serials #serialPurchasePanel .serial-purchase-grid-primary {
    gap: 13px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-grid label {
    gap: 6px;
  }

  #tab-serials #serialPurchasePanel .field-control > input,
  #tab-serials #serialPurchasePanel .field-control > select,
  #tab-serials #serialPurchasePanel .field-control > textarea,
  #tab-serials #serialPurchasePanel .field-control > .searchable-select-input {
    min-height: 46px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-entry-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #tab-serials #serialPurchasePanel .serial-purchase-entry-tabs button {
    min-height: 46px;
    font-size: 10px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-entry-tabs button span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-dropzone {
    padding: 12px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-entry-example,
  #tab-serials #serialPurchasePanel .serial-purchase-preview-panel {
    display: none !important;
  }

  #tab-serials #serialPurchasePanel #serialPurchaseBulkInput {
    min-height: 190px;
    max-height: 42dvh;
    resize: vertical;
    text-align: left;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-preview-panel {
    margin-top: 10px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-preview-panel .data-table {
    max-height: 280px;
    overflow: auto;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-summary-list div,
  #tab-serials #serialPurchasePanel .serial-purchase-count-list div {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 10px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-summary-preview {
    display: block;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #e3e9f3;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-summary-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-summary-head button {
    min-height: 36px;
    padding: 6px 9px;
    border: 0;
    background: transparent;
    color: #1264e8;
    font-size: 11px;
    font-weight: 800;
  }

  #tab-serials #serialPurchasePanel #serialPurchaseMobileSummarySerials {
    display: grid;
    gap: 0;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
  }

  #tab-serials #serialPurchasePanel #serialPurchaseMobileSummarySerials li {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 8px;
    padding: 8px 0;
    border-top: 1px solid #edf0f5;
    color: #263756;
    font-size: 12px;
    overflow-wrap: anywhere;
  }

  #tab-serials #serialPurchasePanel #serialPurchaseMobileSummarySerials li span {
    color: #7a869e;
    text-align: center;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review {
    display: block;
    padding: 16px;
    border: 1px solid #e1e7f1;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(31, 55, 104, .05);
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-heading {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    margin-bottom: 12px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-heading > span {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: #e8f1ff;
    color: #1264e8;
    font-weight: 850;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-heading h4,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-heading p {
    margin: 0;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-heading p {
    margin-top: 3px;
    color: #66738d;
    font-size: 11px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list {
    display: grid;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list button {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) 18px;
    gap: 10px;
    align-items: center;
    width: 100%;
    min-height: 58px;
    padding: 9px 4px;
    border: 0;
    border-top: 1px solid #e8edf4;
    background: transparent;
    color: #152546;
    text-align: left;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list button:first-child {
    border-top: 0;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list button > .bi-check-circle-fill {
    color: #18ad67;
    font-size: 18px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list button span,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list button strong,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list button small {
    display: block;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list button strong {
    font-size: 13px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-list button small {
    margin-top: 2px;
    overflow: hidden;
    color: #6d7890;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-review-note {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 9px;
    margin-top: 10px;
    padding: 11px;
    border-radius: 12px;
    background: #edf5ff;
    color: #31537f;
    font-size: 10px;
    line-height: 1.4;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-actionbar {
    position: sticky;
    bottom: 68px;
    z-index: 9;
    margin: 14px -12px 0;
    padding: 10px 12px;
    border: 0;
    border-top: 1px solid #dfe6f2;
    border-radius: 0;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 -8px 22px rgba(31, 55, 104, .08);
    backdrop-filter: blur(10px);
  }

  #tab-serials #serialPurchasePanel .serial-purchase-actionbar > div:first-child,
  #tab-serials #serialPurchasePanel .serial-purchase-actions {
    display: none;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-actions button {
    width: 100%;
    min-height: 46px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-actions button[hidden] {
    display: none !important;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success {
    display: grid;
    justify-items: stretch;
    gap: 14px;
    min-height: 510px;
    padding: 74px 16px 28px;
    text-align: center;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success[hidden] {
    display: none !important;
  }

  #tab-serials #serialPurchasePanel.is-mobile-success .serial-purchase-hero,
  #tab-serials #serialPurchasePanel.is-mobile-success .serial-purchase-form {
    display: none !important;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success-icon {
    display: grid;
    place-items: center;
    width: 92px;
    height: 92px;
    margin: 0 auto 8px;
    border: 18px solid #dff8ec;
    border-radius: 50%;
    background: #16b86b;
    color: #fff;
    font-size: 34px;
    box-shadow: 0 12px 30px rgba(22, 184, 107, .2);
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success h3,
  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success p {
    margin: 0;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success h3 {
    color: #0d1b3e;
    font-size: 22px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success p {
    color: #63708f;
    font-size: 13px;
    line-height: 1.5;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success dl {
    display: grid;
    gap: 0;
    width: 100%;
    margin: 8px 0;
    padding: 5px 14px;
    border: 1px solid #e1e7f1;
    border-radius: 14px;
    background: #fff;
    text-align: left;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success dl div {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 10px;
    padding: 10px 0;
    border-top: 1px solid #edf0f5;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success dl div:first-child {
    border-top: 0;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success dt {
    color: #71809a;
    font-size: 11px;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success dd {
    margin: 0;
    color: #142445;
    font-size: 12px;
    font-weight: 800;
    overflow-wrap: anywhere;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success-actions {
    display: grid;
    gap: 9px;
    align-self: end;
  }

  #tab-serials #serialPurchasePanel .serial-purchase-mobile-success-actions button {
    width: 100%;
    min-height: 48px;
  }

  /* Sale Outward is a three-step APK transaction flow; desktop retains the full form. */
  #tab-serials.is-serial-sale-mobile-view > .panel-card > .panel-heading {
    display: none !important;
  }

  #tab-serials.is-serial-sale-mobile-view > .panel-card {
    padding-top: 0;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-only {
    display: block;
  }

  #tab-serials #serialSalePanel button.serial-sale-mobile-only,
  #tab-serials #serialSalePanel .serial-sale-qty-adjust,
  #tab-serials #serialSalePanel .serial-sale-mobile-more-btn {
    display: inline-flex;
  }

  #tab-serials #serialSalePanel [hidden],
  #tab-serials #serialSalePanel .serial-sale-mobile-more-dialog[hidden] {
    display: none !important;
  }

  #tab-serials #serialSalePanel .serial-sale-hero {
    position: sticky;
    top: 0;
    z-index: 8;
    gap: 12px;
    margin: 0 -12px;
    padding: 13px 12px 11px;
    border: 0;
    border-bottom: 1px solid #dfe7f4;
    border-radius: 0;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 6px 18px rgba(31, 55, 104, .08);
    backdrop-filter: blur(12px);
  }

  #tab-serials #serialSalePanel .serial-sale-hero .serial-purchase-title {
    display: block;
  }

  #tab-serials #serialSalePanel .serial-sale-title-icon {
    display: none;
  }

  #tab-serials #serialSalePanel .serial-purchase-title h3 {
    margin: 0;
    font-size: 24px;
    line-height: 1.15;
  }

  #tab-serials #serialSalePanel .serial-purchase-title p {
    margin: 3px 0 0;
    color: #63708f;
    font-size: 13px;
  }

  #tab-serials #serialSalePanel .serial-sale-steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin: 2px 0 0;
    padding: 0;
    background: transparent;
  }

  #tab-serials #serialSalePanel .serial-sale-steps::before {
    content: "";
    position: absolute;
    top: 14px;
    right: 16.66%;
    left: 16.66%;
    height: 2px;
    background: #ccd6e6;
  }

  #tab-serials #serialSalePanel .serial-sale-steps li {
    position: relative;
    z-index: 1;
    display: block;
    padding: 0;
    background: transparent;
  }

  #tab-serials #serialSalePanel .serial-sale-steps button {
    display: grid;
    justify-items: center;
    gap: 4px;
    width: 100%;
    min-height: 48px;
    padding: 0 3px;
    border: 0;
    background: transparent;
    color: #65718a;
  }

  #tab-serials #serialSalePanel .serial-sale-steps span {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #c8d2e2;
    color: #fff;
    font-size: 12px;
    font-weight: 850;
    box-shadow: 0 0 0 1px #c8d2e2;
  }

  #tab-serials #serialSalePanel .serial-sale-steps strong {
    color: inherit;
    font-size: 11px;
    line-height: 1.2;
  }

  #tab-serials #serialSalePanel .serial-sale-steps li.is-active button,
  #tab-serials #serialSalePanel .serial-sale-steps li.is-complete button {
    color: #0f57d5;
  }

  #tab-serials #serialSalePanel .serial-sale-steps li.is-active span,
  #tab-serials #serialSalePanel .serial-sale-steps li.is-complete span {
    background: #1264e8;
    box-shadow: 0 0 0 1px #1264e8;
  }

  #tab-serials #serialSalePanel .serial-sale-steps li.is-complete span {
    font-size: 0;
  }

  #tab-serials #serialSalePanel .serial-sale-steps li.is-complete span::after {
    content: "✓";
    font-size: 13px;
  }

  #tab-serials #serialSalePanel .serial-purchase-main {
    display: contents;
  }

  #tab-serials #serialSalePanel .serial-purchase-left {
    display: contents;
  }

  #tab-serials #serialSalePanel .serial-sale-side {
    display: none !important;
  }

  #tab-serials #serialSalePanel [data-serial-sale-step-panel]:not(.is-mobile-step-active),
  #tab-serials #serialSalePanel [data-serial-sale-mode-panel]:not(.is-mobile-mode-active) {
    display: none !important;
  }

  #tab-serials #serialSalePanel [data-serial-sale-step-panel].is-mobile-step-active {
    width: 100%;
  }

  #tab-serials #serialSalePanel .serial-purchase-section,
  #tab-serials #serialSalePanel .serial-sale-mobile-review {
    margin-top: 12px;
    padding: 15px;
    border: 1px solid #e1e7f1;
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(31, 55, 104, .05);
  }

  #tab-serials #serialSalePanel .serial-sale-details-grid {
    gap: 13px;
  }

  #tab-serials #serialSalePanel .serial-sale-details-grid > label:nth-child(1) { order: 1; }
  #tab-serials #serialSalePanel .serial-sale-details-grid > label:nth-child(2) { order: 2; }
  #tab-serials #serialSalePanel .serial-sale-details-grid > label:nth-child(3) { order: 3; }
  #tab-serials #serialSalePanel .serial-sale-qty-field { order: 4; }
  #tab-serials #serialSalePanel .serial-sale-details-grid > label:nth-child(4) { order: 5; }
  #tab-serials #serialSalePanel .serial-sale-details-grid > label:nth-child(5) { order: 6; }
  #tab-serials #serialSalePanel .serial-sale-mobile-notes-field { order: 7; }

  #tab-serials #serialSalePanel .serial-sale-mobile-notes-field {
    display: grid;
  }

  #tab-serials #serialSalePanel .serial-sale-qty-control {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    gap: 6px;
    padding: 4px;
  }

  #tab-serials #serialSalePanel .serial-sale-qty-control > .field-icon {
    display: none;
  }

  #tab-serials #serialSalePanel .serial-sale-qty-control input {
    min-height: 38px;
    padding: 0;
    border: 0;
    text-align: center;
    font-weight: 850;
    -moz-appearance: textfield;
  }

  #tab-serials #serialSalePanel .serial-sale-qty-control input::-webkit-inner-spin-button,
  #tab-serials #serialSalePanel .serial-sale-qty-control input::-webkit-outer-spin-button {
    margin: 0;
    appearance: none;
  }

  #tab-serials #serialSalePanel .serial-sale-qty-adjust {
    align-items: center;
    justify-content: center;
    min-height: 38px;
    border: 0;
    border-radius: 10px;
    background: #edf3ff;
    color: #0d59dc;
    font-size: 17px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-section-heading,
  #tab-serials #serialSalePanel .serial-sale-mobile-review-head,
  #tab-serials #serialSalePanel .serial-sale-mobile-selected-review > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-section-heading h4 {
    margin: 0;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-btn {
    align-items: center;
    gap: 3px;
    min-height: 36px;
    padding: 6px 8px;
    border: 1px solid #dce5f3;
    border-radius: 10px;
    background: #f6f9fe;
    color: #1b58bd;
    font-size: 11px;
    font-weight: 800;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-product-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    margin: 12px 0 10px;
    padding: 11px;
    border: 1px solid #e2e8f3;
    border-radius: 14px;
    background: #f8fbff;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-product-card > span {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: #e6efff;
    color: #1264e8;
    font-size: 19px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-product-card strong,
  #tab-serials #serialSalePanel .serial-sale-mobile-product-card small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-product-card strong {
    color: #112344;
    font-size: 14px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-product-card small {
    margin-top: 3px;
    color: #63708f;
    font-size: 11px;
  }

  #tab-serials #serialSalePanel .serial-sale-entry-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-bottom: 10px;
  }

  #tab-serials #serialSalePanel .serial-sale-entry-tabs #importSerialSaleCsvBtn {
    display: none;
  }

  #tab-serials #serialSalePanel .serial-sale-entry-tabs button {
    display: grid;
    justify-items: center;
    gap: 4px;
    min-height: 58px;
    padding: 7px 4px;
    color: #53617d;
  }

  #tab-serials #serialSalePanel .serial-sale-entry-tabs button.active {
    background: #1264e8;
    color: #fff;
    box-shadow: 0 5px 12px rgba(18, 100, 232, .22);
  }

  #tab-serials #serialSalePanel .serial-sale-stock-hint,
  #tab-serials #serialSalePanel .serial-sale-add-selected-btn,
  #tab-serials #serialSalePanel .serial-sale-entry-section .serial-sale-notes-field,
  #tab-serials #serialSalePanel .serial-sale-entry-section .serial-sale-b2b-warranty-note {
    display: none !important;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-box {
    padding: 0;
    border: 0;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-search {
    min-height: 46px;
    margin-bottom: 8px;
    border-radius: 12px;
    background: #fff;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-search > i {
    display: none;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-search input {
    min-height: 44px;
    padding: 0 4px;
    border: 0;
    background-color: transparent;
    box-shadow: none;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-list {
    max-height: min(47dvh, 430px);
    padding: 0;
    border: 1px solid #e1e7f1;
    border-radius: 13px;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-row {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 7px;
    min-height: 52px;
    padding: 7px 8px;
    border-bottom: 1px solid #e9edf4;
    border-radius: 0;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-row:last-child {
    border-bottom: 0;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-row.is-added {
    background: #edf5ff;
    color: #102e69;
    cursor: pointer;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-row-main {
    grid-column: 2;
    grid-row: 1;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-add-btn {
    grid-column: 1;
    grid-row: 1;
    width: 32px;
    min-width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 8px;
  }

  #tab-serials #serialSalePanel .serial-sale-stock-add-btn span {
    display: none;
  }

  #tab-serials #serialSalePanel .serial-sale-entry-section {
    padding: 14px;
  }

  #tab-serials #serialSalePanel .serial-sale-box-heading h4 span {
    display: none;
  }

  #tab-serials #serialSalePanel .serial-sale-dropzone {
    padding: 10px;
  }

  #tab-serials #serialSalePanel #serialSaleSerialInput {
    min-height: 210px;
    max-height: 45dvh;
    text-align: left;
    resize: vertical;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-scan-panel {
    text-align: left;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-scan-panel p {
    margin: 0 0 12px;
    color: #63708f;
    font-size: 12px;
    line-height: 1.45;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-scan-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-scan-control input,
  #tab-serials #serialSalePanel .serial-sale-mobile-scan-control button {
    min-height: 48px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review {
    display: block;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review-head h4,
  #tab-serials #serialSalePanel .serial-sale-mobile-review-head p {
    margin: 0;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review-head p {
    margin-top: 3px;
    color: #65718a;
    font-size: 11px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review-head button,
  #tab-serials #serialSalePanel .serial-sale-mobile-selected-review button {
    min-height: 38px;
    padding: 7px 5px;
    border: 0;
    background: transparent;
    color: #1264e8;
    font-size: 12px;
    font-weight: 850;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review-details {
    display: grid;
    margin: 12px 0 0;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review-details div {
    display: grid;
    grid-template-columns: minmax(108px, .8fr) minmax(0, 1.2fr);
    gap: 10px;
    padding: 10px 0;
    border-top: 1px solid #e9edf4;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review-details dt {
    color: #68758e;
    font-size: 11px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review-details dt i {
    width: 20px;
    color: #1264e8;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-review-details dd {
    margin: 0;
    color: #132344;
    font-size: 12px;
    font-weight: 750;
    overflow-wrap: anywhere;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-selected-review {
    margin-top: 12px;
    padding: 12px;
    border: 1px solid #e2e8f3;
    border-radius: 14px;
    background: #fbfdff;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-selected-review h4 {
    margin: 0;
    font-size: 14px;
  }

  #tab-serials #serialSalePanel #serialSaleMobileReviewSerials {
    display: grid;
    gap: 7px;
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
  }

  #tab-serials #serialSalePanel #serialSaleMobileReviewSerials li {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 7px;
    align-items: center;
    color: #20314f;
    font-size: 11px;
  }

  #tab-serials #serialSalePanel #serialSaleMobileReviewSerials li i {
    color: #20a55e;
  }

  #tab-serials #serialSalePanel #serialSaleMobileReviewSerials li.is-empty i,
  #tab-serials #serialSalePanel #serialSaleMobileReviewSerials li.is-more i {
    color: #71809a;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-validation-state {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 9px;
    align-items: center;
    width: 100%;
    min-height: 62px;
    margin-top: 12px;
    padding: 10px 12px;
    border: 0;
    border-radius: 13px;
    background: #eaf9f0;
    color: #187c46;
    text-align: left;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-validation-state > i {
    font-size: 27px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-validation-state strong,
  #tab-serials #serialSalePanel .serial-sale-mobile-validation-state small {
    display: block;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-validation-state small {
    margin-top: 2px;
    font-size: 10px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-validation-state.is-warning {
    background: #fff7df;
    color: #9a6500;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-validation-state.is-error {
    background: #fff0f1;
    color: #c92c3c;
  }

  #tab-serials #serialSalePanel .serial-sale-actionbar {
    position: sticky;
    bottom: 68px;
    z-index: 9;
    margin: 14px -12px 0;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
    border: 0;
    border-top: 1px solid #dfe6f2;
    border-radius: 0;
    background: rgba(255, 255, 255, .97);
    box-shadow: 0 -8px 22px rgba(31, 55, 104, .09);
    backdrop-filter: blur(10px);
  }

  #tab-serials #serialSalePanel .serial-sale-actionbar > div:first-child,
  #tab-serials #serialSalePanel .serial-sale-actionbar > .serial-purchase-actions {
    display: none;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    width: 100%;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-actions button {
    width: 100%;
    min-height: 48px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-footer-count {
    display: none;
    align-items: center;
    min-height: 48px;
    padding: 0 10px;
    border-radius: 12px;
    background: #eef4ff;
    color: #173e85;
    font-size: 12px;
    font-weight: 850;
  }

  #tab-serials #serialSalePanel .serial-sale-form[data-mobile-step="2"] .serial-sale-mobile-actions {
    grid-template-columns: minmax(112px, .8fr) minmax(0, 1.2fr);
  }

  #tab-serials #serialSalePanel .serial-sale-form[data-mobile-step="2"] .serial-sale-mobile-footer-count {
    display: flex;
  }

  #tab-serials #serialSalePanel .serial-sale-form[data-mobile-step="2"] #serialSaleMobileBackBtn {
    display: none !important;
  }

  #tab-serials #serialSalePanel .serial-sale-form[data-mobile-step="3"] .serial-sale-mobile-actions {
    grid-template-columns: minmax(92px, .65fr) minmax(0, 1.35fr);
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-dialog {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: flex-end;
    padding: 0;
    background: rgba(7, 18, 42, .52);
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-sheet {
    width: 100%;
    max-height: 78dvh;
    padding: 16px 14px calc(16px + env(safe-area-inset-bottom, 0px));
    overflow: auto;
    border-radius: 22px 22px 0 0;
    background: #fff;
    box-shadow: 0 -14px 38px rgba(7, 18, 42, .2);
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 0 3px 10px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-head h3 {
    margin: 0;
    font-size: 17px;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-head button {
    width: 40px;
    min-height: 40px;
    border: 0;
    border-radius: 10px;
    background: #f0f4fa;
    color: #20314f;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-sheet > button:not(.secondary-btn) {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    gap: 10px;
    align-items: center;
    width: 100%;
    min-height: 62px;
    padding: 10px 4px;
    border: 0;
    border-top: 1px solid #e8edf4;
    background: transparent;
    color: #172744;
    text-align: left;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-sheet > button:not(.secondary-btn) > i:first-child {
    color: #1264e8;
    font-size: 20px;
    text-align: center;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-sheet > button span,
  #tab-serials #serialSalePanel .serial-sale-mobile-more-sheet > button strong,
  #tab-serials #serialSalePanel .serial-sale-mobile-more-sheet > button small {
    display: block;
  }

  #tab-serials #serialSalePanel .serial-sale-mobile-more-sheet > button small {
    margin-top: 2px;
    color: #6b7891;
    font-size: 10px;
  }

  #tab-serials #serialSalePanel #serialSaleMobileMoreCancelBtn {
    width: 100%;
    min-height: 46px;
    margin-top: 10px;
  }
}

@media (max-width: 390px) {
  #tab-serial-home .serial-home-body,
  #tab-serials > .panel-card,
  #tab-serial-records > .panel-card,
  #tab-serial-incoming > .panel-card,
  #tab-serial-vouchers > .panel-card {
    padding-inline: 9px;
  }

  #tab-serial-home .serial-home-stat-grid .payment-home-stat-card {
    grid-template-columns: 36px minmax(0, 1fr);
    gap: 8px;
    padding: 11px;
  }

  #tab-serial-home .payment-home-stat-icon {
    width: 36px;
    height: 36px;
    font-size: 16px;
  }

  #tab-serial-home .payment-home-stat-card strong {
    font-size: 23px;
  }
}

/* Product Serials: dense phone/APK list, filters and detail layers. */
@media (max-width: 720px) {
  body.serial-mobile-layer-open {
    overflow: hidden;
  }

  #tab-serial-records > .serial-listing-page {
    padding: 0 0 88px;
    border: 0;
    border-radius: 0;
    background: #f5f8fd;
    box-shadow: none;
  }

  #tab-serial-records .serial-listing-header,
  #tab-serial-records .serial-drilldown-bar,
  #tab-serial-records .serial-insights,
  #tab-serial-records .serial-secondary-filters,
  #tab-serial-records .serial-status-legend {
    display: none !important;
  }

  #tab-serial-records .serial-records-mobile-header {
    position: sticky;
    top: 0;
    z-index: 20;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    align-items: center;
    min-height: 58px;
    padding: 7px 10px;
    border-bottom: 1px solid #e1e8f3;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(14px);
  }

  #tab-serial-records .serial-records-mobile-header strong {
    color: #102044;
    font-size: 18px;
    text-align: center;
  }

  #tab-serial-records .serial-records-mobile-header button,
  #tab-serial-records .serial-mobile-details > header button,
  #tab-serial-records .serial-mobile-sheet > header button {
    display: grid;
    place-items: center;
    width: 44px;
    min-height: 44px;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #102b59;
    font-size: 21px;
  }

  #tab-serial-records .serial-listing-page .serial-records-panel {
    display: block;
    padding: 12px;
    border: 0;
    border-radius: 0;
    background: #f5f8fd;
    box-shadow: none;
  }

  #tab-serial-records .serial-mobile-product-card:not([hidden]) {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr);
    gap: 10px 12px;
    align-items: center;
    margin-bottom: 12px;
    padding: 13px;
    border: 1px solid #e0e7f2;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(26, 55, 102, .05);
  }

  #tab-serial-records .serial-mobile-product-thumb {
    display: grid;
    place-items: center;
    width: 54px;
    height: 50px;
    overflow: hidden;
    border-radius: 12px;
    background: #eef4ff;
    color: #1461df;
    font-size: 24px;
  }

  #tab-serial-records .serial-mobile-product-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }

  #tab-serial-records .serial-mobile-product-copy strong,
  #tab-serial-records .serial-mobile-product-copy small {
    display: block;
  }

  #tab-serial-records .serial-mobile-product-copy strong {
    overflow: hidden;
    color: #101f40;
    font-size: 14px;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #tab-serial-records .serial-mobile-product-copy small {
    margin-top: 3px;
    color: #66738e;
    font-size: 10px;
  }

  #tab-serial-records .serial-mobile-product-counts {
    grid-column: 1 / -1;
    display: flex;
    gap: 7px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  #tab-serial-records .serial-mobile-product-counts::-webkit-scrollbar,
  #tab-serial-records .serial-mobile-status-chips::-webkit-scrollbar {
    display: none;
  }

  #tab-serial-records .serial-mobile-product-counts span {
    flex: 0 0 auto;
    padding: 6px 9px;
    border-radius: 9px;
    background: #f1f4f9;
    color: #4f5e7a;
    font-size: 10px;
  }

  #tab-serial-records .serial-mobile-product-counts span strong {
    color: #17294d;
    font-size: 11px;
  }

  #tab-serial-records .serial-mobile-product-counts .is-available {
    background: #e8f8ef;
    color: #1f7b4a;
  }

  #tab-serial-records .serial-mobile-product-counts .is-assigned {
    background: #e8f1ff;
    color: #195fbf;
  }

  #tab-serial-records .serial-records-toolbar {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
  }

  #tab-serial-records .serial-records-row-filters {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
  }

  #tab-serial-records .serial-records-row-filters > .serial-filter-control:not(.serial-filter-search),
  #tab-serial-records .serial-records-row-filters > .serial-reset-filter-btn {
    display: none;
  }

  #tab-serial-records .serial-filter-search {
    position: relative;
    display: block;
  }

  #tab-serial-records .serial-filter-search > span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  #tab-serial-records .serial-filter-search i {
    left: 13px;
    color: #71809a;
  }

  #tab-serial-records .serial-filter-search input {
    width: 100%;
    min-height: 46px;
    padding: 10px 12px 10px 39px;
    border: 1px solid #dbe4f0;
    border-radius: 12px;
    background: #fff;
    font-size: 13px;
  }

  #tab-serial-records .serial-apply-filter-btn {
    min-height: 46px;
    padding: 0 12px;
    border-radius: 12px;
    background: #eef4ff;
    color: #135dc9;
    white-space: nowrap;
  }

  #tab-serial-records .serial-apply-filter-btn > span {
    display: inline-grid;
    place-items: center;
    min-width: 18px;
    height: 18px;
    margin-left: 3px;
    border-radius: 99px;
    background: #1264e8;
    color: #fff;
    font-size: 9px;
  }

  #tab-serial-records .serial-mobile-status-chips {
    display: flex;
    gap: 7px;
    margin: 11px -12px 0;
    padding: 0 12px 6px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  #tab-serial-records .serial-mobile-status-chip {
    flex: 0 0 auto;
    min-height: 34px;
    padding: 7px 11px;
    border: 1px solid #dde5f2;
    border-radius: 99px;
    background: #fff;
    color: #54617c;
    font-size: 10px;
    font-weight: 750;
    white-space: nowrap;
  }

  #tab-serial-records .serial-mobile-status-chip strong {
    margin-left: 3px;
    color: inherit;
  }

  #tab-serial-records .serial-mobile-status-chip.is-active {
    border-color: #1264e8;
    background: #1264e8;
    color: #fff;
    box-shadow: 0 5px 12px rgba(18, 100, 232, .2);
  }

  #tab-serial-records .serial-mobile-list-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 42px;
    margin-top: 5px;
    padding: 3px 2px;
  }

  #tab-serial-records .serial-mobile-list-heading strong {
    font-size: 13px;
  }

  #tab-serial-records .serial-mobile-list-heading button {
    min-height: 40px;
    padding: 0 7px;
    border: 0;
    background: transparent;
    color: #075fe1;
    font-size: 11px;
    font-weight: 750;
  }

  #tab-serial-records .serial-list-card-table {
    padding: 0;
    overflow: visible;
    border: 1px solid #e1e7f1;
    border-radius: 14px;
    background: #fff;
    box-shadow: none;
  }

  #tab-serial-records .serial-main-table,
  #tab-serial-records .serial-main-table tbody {
    display: block;
    width: 100%;
  }

  #tab-serial-records .serial-main-table thead {
    display: none;
  }

  #tab-serial-records .serial-list-card-table tbody tr.serial-card-row {
    position: relative;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto 38px;
    gap: 5px;
    align-items: center;
    min-height: 68px;
    margin: 0;
    padding: 8px 5px 8px 9px;
    border: 0;
    border-bottom: 1px solid #e9edf4;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    cursor: pointer;
  }

  #tab-serial-records .serial-list-card-table tbody tr.serial-card-row:last-child {
    border-bottom: 0;
  }

  #tab-serial-records .serial-list-card-table tbody tr.serial-card-row.is-selected {
    background: #f0f6ff;
    box-shadow: inset 3px 0 #1264e8;
  }

  #tab-serial-records .serial-card-row > td {
    display: block;
    width: auto;
    min-width: 0;
    padding: 0;
    border: 0;
  }

  #tab-serial-records .serial-card-row .serial-purchase-cell,
  #tab-serial-records .serial-card-row .serial-sale-cell,
  #tab-serial-records .serial-card-row .serial-warranty-cell {
    display: none;
  }

  #tab-serial-records .serial-mobile-product-scoped .serial-card-row .serial-item-cell {
    display: none;
  }

  #tab-serial-records .serial-records-panel:not(.serial-mobile-product-scoped) .serial-card-row {
    grid-template-rows: auto auto;
    min-height: 82px;
  }

  #tab-serial-records .serial-records-panel:not(.serial-mobile-product-scoped) .serial-card-row .serial-item-cell {
    grid-column: 2 / 4;
    grid-row: 2;
    display: flex;
    gap: 5px;
    align-items: center;
    overflow: hidden;
    color: #596983;
    font-size: 9px;
  }

  #tab-serial-records .serial-records-panel:not(.serial-mobile-product-scoped) .serial-card-row .serial-item-cell strong {
    overflow: hidden;
    font-size: 9.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #tab-serial-records .serial-records-panel:not(.serial-mobile-product-scoped) .serial-card-row .serial-item-cell > span,
  #tab-serial-records .serial-records-panel:not(.serial-mobile-product-scoped) .serial-card-row .serial-source-badge {
    display: none;
  }

  #tab-serial-records .serial-select-cell {
    grid-column: 1;
    grid-row: 1;
  }

  #tab-serial-records .serial-select-cell input {
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: #1264e8;
  }

  #tab-serial-records .serial-number-cell {
    grid-column: 2;
    grid-row: 1;
  }

  #tab-serial-records .serial-number-link {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: #142447;
    font-size: 12px;
    font-weight: 800;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #tab-serial-records .serial-inline-actions,
  #tab-serial-records .serial-number-cell > .serial-location {
    display: none;
  }

  #tab-serial-records .serial-mobile-context {
    display: block;
    margin-top: 4px;
    overflow: hidden;
    color: #70809a;
    font-size: 9.5px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #tab-serial-records .serial-status-cell {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    padding-top: 4px;
  }

  #tab-serial-records .serial-list-status {
    padding: 5px 8px;
    font-size: 9px;
    white-space: nowrap;
  }

  #tab-serial-records .serial-status-cell .serial-share-note {
    display: none;
  }

  #tab-serial-records .serial-action-cell {
    grid-column: 4;
    grid-row: 1;
  }

  #tab-serial-records .serial-action-summary {
    display: grid;
    place-items: center;
    width: 38px;
    min-height: 44px;
    border-radius: 10px;
    font-size: 18px;
  }

  #tab-serial-records .serial-action-menu[open]::before {
    position: fixed;
    z-index: 1000;
    inset: 0;
    background: rgba(14, 26, 49, .5);
    content: "";
  }

  #tab-serial-records .serial-action-menu[open] .serial-action-menu-list {
    position: fixed;
    z-index: 1001;
    right: 0;
    bottom: 0;
    left: 0;
    display: grid;
    width: 100%;
    max-height: 76dvh;
    padding: 20px 14px calc(14px + env(safe-area-inset-bottom));
    overflow-y: auto;
    border-radius: 22px 22px 0 0;
    background: #fff;
    box-shadow: 0 -18px 46px rgba(9, 28, 62, .2);
  }

  #tab-serial-records .serial-action-menu-list .serial-action-btn {
    justify-content: flex-start;
    min-height: 50px;
    padding: 8px 10px;
    border: 0;
    border-bottom: 1px solid #e9edf4;
    border-radius: 0;
    background: transparent;
    color: #17284a;
    text-align: left;
  }

  #tab-serial-records .serial-action-menu-list .serial-mobile-menu-only {
    display: flex;
  }

  #tab-serial-records .serial-action-menu-list .serial-action-danger {
    color: #d42635;
  }

  #tab-serial-records .serial-empty-row,
  #tab-serial-records .serial-empty-row td {
    display: block;
    width: 100%;
  }

  #tab-serial-records .serial-empty-row .empty-state {
    padding: 42px 18px;
    color: #687791;
    font-size: 12px;
    text-align: center;
  }

  #tab-serial-records .serial-list-footer {
    display: block;
    margin-top: 10px;
  }

  #tab-serial-records .serial-list-footer .serial-search-summary,
  #tab-serial-records .serial-list-footer .serial-rows-per-page {
    display: none;
  }

  #tab-serial-records .serial-list-pagination {
    display: block;
  }

  #tab-serial-records .serial-mobile-load-more {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    min-height: 44px;
    border: 0;
    border-radius: 12px;
    background: #1264e8;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
  }

  #tab-serial-records .serial-mobile-load-more span {
    font-size: 9px;
    font-weight: 650;
    opacity: .82;
  }

  #tab-serial-records .serial-mobile-overlay:not([hidden]) {
    position: fixed;
    z-index: 1200;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding: 0;
    background: rgba(11, 25, 51, .52);
  }

  #tab-serial-records .serial-mobile-sheet {
    width: min(100%, 560px);
    max-height: 88dvh;
    padding: 7px 14px calc(14px + env(safe-area-inset-bottom));
    overflow-y: auto;
    border-radius: 22px 22px 0 0;
    background: #fff;
    box-shadow: 0 -18px 50px rgba(9, 28, 62, .22);
  }

  #tab-serial-records .serial-mobile-sheet-handle {
    width: 44px;
    height: 4px;
    margin: 0 auto 7px;
    border-radius: 99px;
    background: #acb8cb;
  }

  #tab-serial-records .serial-mobile-sheet > header,
  #tab-serial-records .serial-mobile-details > header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    align-items: center;
    min-height: 52px;
    border-bottom: 1px solid #e5eaf2;
  }

  #tab-serial-records .serial-mobile-sheet > header h3 {
    margin: 0;
    color: #122244;
    font-size: 17px;
  }

  #tab-serial-records .serial-mobile-filter-fields {
    display: grid;
    gap: 12px;
    padding: 14px 0;
  }

  #tab-serial-records .serial-mobile-filter-fields label,
  #tab-serial-records .serial-mobile-filter-fields label > span {
    display: grid;
    gap: 6px;
  }

  #tab-serial-records .serial-mobile-filter-fields label > span {
    color: #283958;
    font-size: 11px;
    font-weight: 800;
  }

  #tab-serial-records .serial-mobile-filter-fields select,
  #tab-serial-records .serial-mobile-filter-fields input {
    width: 100%;
    min-height: 46px;
    padding: 8px 11px;
    border: 1px solid #dbe3ef;
    border-radius: 11px;
    background: #fff;
    color: #172744;
  }

  #tab-serial-records .serial-mobile-filter-sheet > footer {
    position: sticky;
    bottom: 0;
    display: grid;
    grid-template-columns: 1fr 1.3fr;
    gap: 9px;
    padding-top: 10px;
    background: #fff;
  }

  #tab-serial-records .serial-mobile-details:not([hidden]) {
    position: fixed;
    z-index: 1210;
    inset: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    background: #f4f7fc;
  }

  #tab-serial-records .serial-mobile-details > header {
    grid-template-columns: 44px minmax(0, 1fr) 44px;
    padding: 7px 10px;
    border-bottom: 1px solid #dde5f0;
    background: #fff;
  }

  #tab-serial-records .serial-mobile-details > header strong {
    font-size: 17px;
    text-align: center;
  }

  #tab-serial-records .serial-mobile-details-body {
    padding: 12px 12px calc(24px + env(safe-area-inset-bottom));
    overflow-y: auto;
  }

  #tab-serial-records .serial-mobile-detail-hero,
  #tab-serial-records .serial-mobile-detail-card {
    margin-bottom: 10px;
    padding: 14px;
    border: 1px solid #e0e7f1;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(27, 51, 92, .04);
  }

  #tab-serial-records .serial-mobile-detail-hero {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    justify-content: space-between;
  }

  #tab-serial-records .serial-mobile-detail-hero h2,
  #tab-serial-records .serial-mobile-detail-hero p,
  #tab-serial-records .serial-mobile-detail-card h3 {
    margin: 0;
  }

  #tab-serial-records .serial-mobile-detail-hero h2 {
    color: #0e1f43;
    font-size: 18px;
    overflow-wrap: anywhere;
  }

  #tab-serial-records .serial-mobile-detail-hero p {
    margin-top: 5px;
    color: #596983;
    font-size: 11px;
  }

  #tab-serial-records .serial-mobile-detail-hero p small {
    display: block;
    margin-top: 3px;
  }

  #tab-serial-records .serial-mobile-detail-card h3 {
    padding-bottom: 10px;
    border-bottom: 1px solid #e7ebf2;
    color: #10224a;
    font-size: 14px;
  }

  #tab-serial-records .serial-mobile-detail-card > div {
    display: grid;
    grid-template-columns: minmax(92px, .72fr) minmax(0, 1fr);
    gap: 10px;
    padding: 9px 0;
    border-bottom: 1px solid #edf0f5;
  }

  #tab-serial-records .serial-mobile-detail-card > div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
  }

  #tab-serial-records .serial-mobile-detail-card > div > span {
    color: #71809a;
    font-size: 10px;
  }

  #tab-serial-records .serial-mobile-detail-card > div > strong {
    color: #203252;
    font-size: 10.5px;
    font-weight: 700;
    overflow-wrap: anywhere;
  }

  #tab-serial-records .serial-mobile-history ol {
    margin: 0;
    padding: 8px 0 0;
    list-style: none;
  }

  #tab-serial-records .serial-mobile-history li {
    position: relative;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    gap: 9px;
    min-height: 46px;
    padding: 8px 0;
  }

  #tab-serial-records .serial-mobile-history li > i {
    width: 10px;
    height: 10px;
    margin-top: 3px;
    border: 2px solid #fff;
    border-radius: 99px;
    background: #20a466;
    box-shadow: 0 0 0 2px #bfe8d2;
  }

  #tab-serial-records .serial-mobile-history li:not(:last-child)::after {
    position: absolute;
    top: 24px;
    bottom: -5px;
    left: 4px;
    width: 2px;
    background: #dce5f1;
    content: "";
  }

  #tab-serial-records .serial-mobile-history strong,
  #tab-serial-records .serial-mobile-history small {
    display: block;
  }

  #tab-serial-records .serial-mobile-history strong {
    color: #213250;
    font-size: 11px;
  }

  #tab-serial-records .serial-mobile-history small {
    margin-top: 2px;
    color: #74829a;
    font-size: 9.5px;
  }

  #tab-serial-records .serial-mobile-actions-sheet #serialMobileActionsList {
    display: grid;
  }

  #tab-serial-records .serial-mobile-actions-sheet #serialMobileActionsList > button {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 18px;
    gap: 9px;
    align-items: center;
    width: 100%;
    min-height: 54px;
    padding: 7px 4px;
    border: 0;
    border-bottom: 1px solid #e7ecf3;
    background: transparent;
    color: #17284a;
    font-size: 12px;
    font-weight: 750;
    text-align: left;
  }

  #tab-serial-records .serial-mobile-actions-sheet #serialMobileActionsList > button > i:first-child {
    color: #1264e8;
    font-size: 19px;
    text-align: center;
  }

  #tab-serial-records .serial-mobile-actions-sheet #serialMobileActionsList > button.is-danger,
  #tab-serial-records .serial-mobile-actions-sheet #serialMobileActionsList > button.is-danger > i:first-child {
    color: #d42635;
  }

  #tab-serial-records .serial-mobile-actions-sheet #serialMobileActionsList > button:disabled {
    opacity: .42;
  }

  #tab-serial-records .serial-mobile-actions-cancel {
    width: 100%;
    min-height: 46px;
    margin-top: 10px;
  }

  #tab-serial-records .serial-mobile-bulk-bar:not([hidden]) {
    position: fixed;
    z-index: 1100;
    right: 10px;
    bottom: calc(76px + env(safe-area-inset-bottom));
    left: 10px;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    gap: 6px;
    align-items: center;
    min-height: 60px;
    padding: 7px;
    border: 1px solid #dce5f2;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(12, 32, 67, .2);
  }

  #tab-serial-records .serial-mobile-bulk-bar > button:first-child {
    display: grid;
    place-items: center;
    width: 44px;
    min-height: 44px;
    border: 0;
    border-radius: 11px;
    background: #f0f4fa;
    color: #53637e;
  }

  #tab-serial-records .serial-mobile-bulk-bar strong {
    font-size: 12px;
  }

  #tab-serial-records .serial-mobile-bulk-bar .primary-btn {
    min-height: 44px;
    padding-inline: 15px;
    border-radius: 11px;
  }
}