/* PATCH_ID: b2c_orders_real_barcode_v1_20260709 */

/* real order barcode ticket stub */
.b2c-ticket-stub-native-v2{
  position:relative;
  display:grid;
  grid-template-columns:minmax(160px,.86fr) minmax(210px,1.14fr);
  gap:16px;
  align-items:center;
  margin:8px 0 16px;
  padding:13px 15px;
  border-radius:18px;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(35,27,43,.018) 0px,
      rgba(35,27,43,.018) 1px,
      transparent 1px,
      transparent 6px
    ),
    linear-gradient(135deg, rgba(255,255,255,.72), rgba(255,250,253,.52));
  border:1px dashed rgba(120,98,135,.24);
  box-shadow:
    0 12px 28px rgba(44,33,58,.045),
    inset 0 1px 0 rgba(255,255,255,.82);
}

.b2c-ticket-stub-native-v2::before{
  content:"";
  position:absolute;
  left:-15px;
  top:50%;
  width:30px;
  height:30px;
  margin-top:-15px;
  border-radius:999px;
  background:#fff;
  box-shadow:0 0 0 1px rgba(232,218,241,.84);
}

.b2c-ticket-stub-native-v2::after{
  content:"";
  position:absolute;
  right:-15px;
  top:50%;
  width:30px;
  height:30px;
  margin-top:-15px;
  border-radius:999px;
  background:#fff;
  box-shadow:0 0 0 1px rgba(232,218,241,.84);
}

.b2c-ticket-stub-native-v2-main{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  min-width:0;
}

.b2c-ticket-stub-native-v2-cell{
  min-width:0;
  padding:8px 10px;
  border-radius:14px;
  background:rgba(255,255,255,.54);
  border:1px solid rgba(244,234,248,.68);
}

.b2c-ticket-stub-native-v2-cell span{
  display:block;
  margin-bottom:5px;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(74,58,88,.46);
}

.b2c-ticket-stub-native-v2-cell b{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size:12px;
  font-weight:1000;
  letter-spacing:.04em;
  color:#24192d;
}

.b2c-ticket-stub-native-v2-barcode{
  min-width:0;
  padding:8px 10px 6px;
  border-radius:14px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(244,234,248,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

.b2c-ticket-stub-native-v2-code128{
  display:block;
  width:100%;
  height:52px;
  color:rgba(31,24,38,.82);
}

.b2c-ticket-stub-native-v2-code128 text{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size:6px;
  font-weight:800;
  letter-spacing:.08em;
  fill:rgba(31,24,38,.66);
}

/* remove old decorative pseudo barcode after real barcode is enabled */
.b2c-order-ticket-native-v2 .order-summary-v2::after{
  display:none!important;
}

/* make ticket header and real barcode look connected */
.b2c-order-ticket-native-v2 .b2c-ticket-native-v2-label{
  margin-bottom:10px!important;
}

.b2c-order-ticket-native-v2 .order-head-v2{
  margin-top:4px!important;
}

/* folded wallet still shows real barcode area nicely */
.b2c-orders-wallet-native-section[data-wallet-group="processing"] .b2c-order-ticket-native-v2{
  max-height:214px!important;
}

.b2c-orders-wallet-native-section[data-wallet-group="completed"] .b2c-order-ticket-native-v2{
  max-height:128px!important;
}

.b2c-orders-wallet-native-section[data-wallet-group="processing"]:hover .b2c-order-ticket-native-v2,
.b2c-orders-wallet-native-section[data-wallet-group="completed"]:hover .b2c-order-ticket-native-v2{
  max-height:780px!important;
}

/* slightly stronger real-ticket side separation */
.b2c-order-ticket-native-v2::after{
  top:62%!important;
}

.b2c-ticket-native-v2-notch{
  top:62%!important;
}

/* mobile */
@media(max-width:760px){
  .b2c-ticket-stub-native-v2{
    grid-template-columns:1fr;
    gap:10px;
    padding:12px;
  }

  .b2c-ticket-stub-native-v2-main{
    grid-template-columns:1fr 72px;
  }

  .b2c-ticket-stub-native-v2-code128{
    height:48px;
  }

  .b2c-orders-wallet-native-section[data-wallet-group="processing"] .b2c-order-ticket-native-v2{
    max-height:206px!important;
  }

  .b2c-orders-wallet-native-section[data-wallet-group="completed"] .b2c-order-ticket-native-v2{
    max-height:116px!important;
  }

  .b2c-orders-wallet-native-section[data-wallet-group="processing"]:hover .b2c-order-ticket-native-v2,
  .b2c-orders-wallet-native-section[data-wallet-group="completed"]:hover .b2c-order-ticket-native-v2{
    max-height:860px!important;
  }
}