/* PATCH_ID: b2c_orders_native_ticket_v2_20260709 */

body:has(.b2c-orders-native-page){
  background:
    radial-gradient(circle at 12% 8%, rgba(246,233,255,.34), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(255,232,245,.28), transparent 34%),
    linear-gradient(180deg,#fff 0%,#fffbfd 58%,#fff 100%);
}

.b2c-orders-native-page{
  max-width:1180px;
  margin-left:auto!important;
  margin-right:auto!important;
}

.b2c-orders-native-page-head{
  margin-bottom:22px!important;
}

.b2c-orders-native-page-head h2{
  position:relative;
  display:inline-block;
  letter-spacing:-.04em;
}

.b2c-orders-native-page-head h2::after{
  content:"";
  display:block;
  width:96px;
  height:3px;
  margin-top:10px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(220,190,240,.95), rgba(255,205,230,.88));
  box-shadow:0 8px 20px rgba(220,190,240,.22);
}

.b2c-orders-native-list{
  display:grid!important;
  gap:30px!important;
  margin-top:18px;
}

/* section header */
.b2c-orders-wallet-native-section{
  position:relative;
  animation:b2cNativeWalletSectionIn .54s cubic-bezier(.22,.8,.2,1) both;
}

.b2c-orders-wallet-native-section:nth-child(2){
  animation-delay:.05s;
}

.b2c-orders-wallet-native-section:nth-child(3){
  animation-delay:.1s;
}

@keyframes b2cNativeWalletSectionIn{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}

.b2c-orders-wallet-native-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin:0 0 14px;
}

.b2c-orders-wallet-native-kicker{
  font-size:10px;
  font-weight:950;
  letter-spacing:.22em;
  color:rgba(91,72,106,.48);
  text-transform:uppercase;
}

.b2c-orders-wallet-native-title{
  margin-top:5px;
  font-size:clamp(18px,2.1vw,25px);
  line-height:1.05;
  font-weight:950;
  color:#201729;
  letter-spacing:-.035em;
}

.b2c-orders-wallet-native-count{
  flex:0 0 auto;
  padding:7px 11px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  color:rgba(74,58,88,.62);
  background:rgba(255,255,255,.74);
  border:1px solid rgba(242,231,248,.9);
  box-shadow:0 10px 26px rgba(44,33,58,.05);
}

.b2c-orders-wallet-native-stack{
  display:flex;
  flex-direction:column;
}

/* native ticket card */
.b2c-order-ticket-native-v2{
  position:relative!important;
  isolation:isolate;
  overflow:hidden!important;
  border-radius:30px!important;
  padding:24px!important;
  background:
    radial-gradient(circle at 0% 58%, transparent 0 15px, rgba(255,255,255,.97) 16px),
    radial-gradient(circle at 100% 58%, transparent 0 15px, rgba(255,255,255,.97) 16px),
    linear-gradient(135deg, rgba(255,255,255,.985), rgba(255,250,253,.945))!important;
  border:1px solid rgba(243,232,248,.92)!important;
  box-shadow:
    0 22px 64px rgba(44,33,58,.08),
    0 1px 0 rgba(255,255,255,.92) inset!important;
  transform-origin:top center;
  animation:b2cNativeTicketEnter .66s cubic-bezier(.22,.8,.2,1) both;
  transition:
    margin-top .48s cubic-bezier(.22,.8,.2,1),
    max-height .54s cubic-bezier(.22,.8,.2,1),
    transform .34s cubic-bezier(.22,.8,.2,1),
    box-shadow .34s ease,
    filter .28s ease!important;
}

@keyframes b2cNativeTicketEnter{
  0%{opacity:0;transform:translateY(24px) scale(.982)}
  62%{opacity:1;transform:translateY(-2px) scale(1.004)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}

.b2c-order-ticket-native-v2::before{
  content:attr(data-ticket-stamp);
  position:absolute;
  right:24px;
  top:18px;
  z-index:0;
  font-size:clamp(24px,4.8vw,58px);
  font-weight:1000;
  letter-spacing:.08em;
  color:rgba(93,72,112,.055);
  transform:rotate(-7deg);
  pointer-events:none;
  white-space:nowrap;
}

.b2c-order-ticket-native-v2::after{
  content:"";
  position:absolute;
  left:30px;
  right:30px;
  top:58%;
  height:1px;
  z-index:0;
  background-image:linear-gradient(to right, rgba(120,98,135,.25) 0 7px, transparent 7px 14px);
  opacity:.76;
  pointer-events:none;
}

.b2c-order-ticket-native-v2 > *{
  position:relative;
  z-index:1;
}

.b2c-ticket-native-v2-label{
  margin-bottom:12px;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.24em;
  color:rgba(91,72,106,.46);
}

.b2c-ticket-native-v2-notch{
  position:absolute!important;
  top:58%;
  width:30px;
  height:30px;
  margin-top:-15px;
  z-index:2!important;
  border-radius:999px;
  background:radial-gradient(circle, rgba(255,255,255,1), rgba(255,251,254,1));
  box-shadow:
    0 0 0 1px rgba(243,232,248,.85),
    inset 0 4px 10px rgba(44,33,58,.035);
  pointer-events:none;
}

.b2c-ticket-native-v2-notch.left{
  left:-15px;
}

.b2c-ticket-native-v2-notch.right{
  right:-15px;
}

/* status tone */
.b2c-order-ticket-native-v2[data-ticket-group="new"]{
  border-color:rgba(229,202,248,.96)!important;
  box-shadow:
    0 24px 70px rgba(126,74,160,.12),
    0 1px 0 rgba(255,255,255,.94) inset!important;
}

.b2c-order-ticket-native-v2[data-ticket-group="processing"]{
  border-color:rgba(215,224,252,.96)!important;
}

.b2c-order-ticket-native-v2[data-ticket-group="completed"]{
  border-color:rgba(230,226,234,.96)!important;
  filter:saturate(.92);
}

/* wallet stack */
.b2c-orders-wallet-native-section[data-wallet-group="new"] .b2c-order-ticket-native-v2{
  max-height:none;
  margin-top:14px;
}

.b2c-orders-wallet-native-section[data-wallet-group="processing"] .b2c-order-ticket-native-v2{
  max-height:166px;
  margin-top:-22px;
}

.b2c-orders-wallet-native-section[data-wallet-group="completed"] .b2c-order-ticket-native-v2{
  max-height:92px;
  margin-top:-52px;
}

.b2c-orders-wallet-native-section .b2c-order-ticket-native-v2:first-child{
  margin-top:0!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:620px;
  margin-top:14px;
}

.b2c-order-ticket-native-v2:hover,
.b2c-order-ticket-native-v2:focus-within{
  transform:translateY(-5px) scale(1.008)!important;
  box-shadow:
    0 30px 86px rgba(44,33,58,.13),
    0 1px 0 rgba(255,255,255,.95) inset!important;
  filter:saturate(1.02);
}

/* inner layout polish */
.b2c-order-ticket-native-v2 .order-head-v2{
  align-items:flex-start!important;
  gap:16px!important;
  margin-bottom:14px!important;
}

.b2c-order-ticket-native-v2 .order-no{
  font-size:15px!important;
  font-weight:950!important;
  color:#21172a!important;
  letter-spacing:-.02em;
}

.b2c-order-ticket-native-v2 .order-date-v2{
  margin-top:5px;
  color:rgba(78,63,92,.58)!important;
  font-size:12px!important;
}

.b2c-order-ticket-native-v2 .order-head-right-v2{
  display:flex!important;
  align-items:flex-end!important;
  flex-direction:column!important;
  gap:8px!important;
}

.b2c-order-ticket-native-v2 .order-status-v2{
  border-radius:999px!important;
  padding:7px 10px!important;
  font-size:11px!important;
  font-weight:950!important;
  letter-spacing:.02em;
  background:rgba(247,241,252,.9)!important;
  border:1px solid rgba(232,219,242,.95)!important;
  color:#513d62!important;
}

.b2c-order-ticket-native-v2 .order-total-v2{
  font-size:18px!important;
  font-weight:1000!important;
  color:#201729!important;
}

.b2c-order-ticket-native-v2 .order-progress-v2{
  margin:12px 0 16px!important;
  padding:10px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.64)!important;
  border:1px solid rgba(243,232,248,.72)!important;
}

.b2c-order-ticket-native-v2 .order-progress-v2 span{
  border-radius:999px!important;
}

.b2c-order-ticket-native-v2 .order-items-v2{
  display:grid!important;
  gap:8px!important;
  margin-top:14px!important;
}

.b2c-order-ticket-native-v2 .order-item-v2{
  border-radius:16px!important;
  padding:10px 12px!important;
  background:rgba(255,255,255,.66)!important;
  border:1px solid rgba(244,234,248,.72)!important;
}

.b2c-order-ticket-native-v2 .order-summary-v2{
  margin-top:22px!important;
  padding-top:22px!important;
  border-top:1px dashed rgba(120,98,135,.25)!important;
}

.b2c-order-ticket-native-v2 .order-detail-v2{
  margin-top:14px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.58)!important;
  border:1px solid rgba(244,234,248,.72)!important;
  padding:12px!important;
}

.b2c-order-ticket-native-v2 .order-detail-v2 summary{
  cursor:pointer;
  font-weight:950;
}

.b2c-order-ticket-native-v2 img{
  border-radius:16px!important;
  box-shadow:0 12px 26px rgba(44,33,58,.08);
  transition:transform .42s cubic-bezier(.22,.8,.2,1), filter .22s ease!important;
}

.b2c-order-ticket-native-v2:hover img{
  transform:scale(1.025);
  filter:saturate(1.04);
}

.b2c-order-ticket-native-v2 button,
.b2c-order-ticket-native-v2 a{
  transition:transform .18s cubic-bezier(.22,.8,.2,1), box-shadow .18s ease, opacity .18s ease!important;
}

.b2c-order-ticket-native-v2 button:hover,
.b2c-order-ticket-native-v2 a:hover{
  transform:translateY(-1px);
}

/* empty */
.b2c-orders-native-empty{
  border-radius:28px!important;
  padding:28px!important;
  background:linear-gradient(135deg, rgba(255,255,255,.96), rgba(255,250,253,.92))!important;
  border:1px solid rgba(243,232,248,.9)!important;
  box-shadow:0 20px 58px rgba(44,33,58,.06);
}

/* mobile */
@media(max-width:760px){
  .b2c-orders-native-list{
    gap:24px!important;
  }

  .b2c-orders-wallet-native-head{
    align-items:flex-start;
  }

  .b2c-order-ticket-native-v2{
    border-radius:24px!important;
    padding:18px!important;
  }

  .b2c-orders-wallet-native-section[data-wallet-group="processing"] .b2c-order-ticket-native-v2{
    max-height:158px;
    margin-top:-18px;
  }

  .b2c-orders-wallet-native-section[data-wallet-group="completed"] .b2c-order-ticket-native-v2{
    max-height:82px;
    margin-top:-42px;
  }

  .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,
  .b2c-order-ticket-native-v2:focus-within{
    max-height:720px!important;
    margin-top:12px!important;
  }

  .b2c-order-ticket-native-v2 .order-head-v2{
    flex-direction:column!important;
  }

  .b2c-order-ticket-native-v2 .order-head-right-v2{
    align-items:flex-start!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .b2c-orders-wallet-native-section,
  .b2c-order-ticket-native-v2{
    animation:none!important;
    transition:none!important;
  }
}
