/* =====================================================
   TITIPIN SELLER APP
   V4.4 - PURCHASE MANAGEMENT
===================================================== */

*{
  box-sizing:border-box;
  -webkit-tap-highlight-color:transparent;
}

:root{
  --bg:#f7f7f5;
  --card:#ffffff;
  --text:#171717;
  --muted:#8a8a86;
  --line:#e8e8e4;
  --dark:#171717;
  --soft:#f1f1ed;

  --green:#24764d;
  --green-bg:#edf8f1;

  --yellow:#9c6800;
  --yellow-bg:#fff7e4;

  --red:#b43b3b;
  --red-bg:#fff0f0;

  --blue:#4355a5;
  --blue-bg:#f1f3ff;

  --purple:#7150a0;
  --purple-bg:#f2edff;
}

html,
body{
  margin:0;
  min-height:100%;
  background:#dededb;
  color:var(--text);
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
}

body{
  min-height:100vh;
}

button,
input,
select,
textarea{
  font:inherit;
}

button{
  cursor:pointer;
}

button:disabled{
  cursor:not-allowed;
  opacity:.45;
}

input,
select,
textarea{
  color:var(--text);
}

textarea{
  resize:vertical;
}

img{
  max-width:100%;
}

.hidden{
  display:none !important;
}


/* =====================================================
   APP
===================================================== */

.app{
  width:100%;
  max-width:430px;
  min-height:100vh;
  margin:0 auto;
  background:var(--bg);
}

.screen{
  display:none;
  min-height:100vh;
  padding:
    24px
    20px
    110px;
}

.screen.active{
  display:block;
}


/* =====================================================
   TYPOGRAPHY
===================================================== */

h1,
h2,
h3,
p{
  margin-top:0;
}

h1{
  font-size:28px;
  line-height:1.1;
  letter-spacing:-1px;
}

h2{
  letter-spacing:-.5px;
}

small{
  color:var(--muted);
}

.section-title{
  margin:
    28px
    0
    13px;
  font-size:17px;
}


/* =====================================================
   TOP BAR
===================================================== */

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin:
    3px
    0
    24px;
}

.topbar small{
  display:block;
  margin-bottom:4px;
  font-size:10px;
}

.topbar h1{
  margin:0;
  font-size:23px;
}

.avatar{
  width:45px;
  height:45px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border:0;
  border-radius:15px;
  background:var(--dark);
  color:#fff;
  font-size:15px;
  font-weight:800;
}


/* =====================================================
   HOME HERO
===================================================== */

.hero{
  overflow:hidden;
  position:relative;
  padding:22px;
  border-radius:26px;
  background:var(--dark);
  color:#fff;
}

.hero>small{
  color:#969696;
  font-size:9px;
  font-weight:800;
  letter-spacing:.8px;
}

.hero h2{
  margin:
    10px
    0
    6px;
  font-size:23px;
}

.hero>p{
  margin:0;
  color:#aaa;
  font-size:12px;
}

.hero-footer{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-top:32px;
}

.hero-footer small{
  display:block;
  margin-bottom:4px;
  color:#888;
  font-size:8px;
  letter-spacing:.7px;
}

.hero-footer strong{
  font-size:23px;
}

.hero-footer button{
  padding:
    11px
    14px;
  border:0;
  border-radius:13px;
  background:#fff;
  color:#171717;
  font-size:11px;
  font-weight:750;
}


/* =====================================================
   HOME STATS
===================================================== */

.stats{
  display:grid;
  grid-template-columns:
    repeat(3,1fr);
  gap:8px;
  margin-top:11px;
}

.stat{
  min-width:0;
  padding:
    14px
    10px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
}

.stat small{
  display:block;
  margin-bottom:7px;
  font-size:8px;
  font-weight:700;
  letter-spacing:.5px;
}

.stat strong{
  display:block;
  overflow:hidden;
  font-size:14px;
  text-overflow:ellipsis;
  white-space:nowrap;
}


/* =====================================================
   PAYMENT ALERT HOME
===================================================== */

.payment-alert{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:12px;
  padding:14px;
  border:1px solid #dce2f8;
  border-radius:19px;
  background:var(--blue-bg);
  cursor:pointer;
}

.payment-alert-icon{
  width:42px;
  height:42px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#fff;
  font-size:20px;
}

.payment-alert-copy{
  min-width:0;
  flex:1;
}

.payment-alert-copy small{
  display:block;
  margin-bottom:3px;
  color:var(--blue);
  font-size:8px;
  font-weight:800;
  letter-spacing:.7px;
}

.payment-alert-copy strong{
  display:block;
  font-size:12px;
}

.payment-alert-copy p{
  margin:
    3px
    0
    0;
  color:#697093;
  font-size:10px;
  line-height:1.4;
}

.payment-alert>span{
  color:var(--blue);
  font-size:23px;
}


/* =====================================================
   V4.4 PURCHASE ALERT HOME
===================================================== */

.purchase-home-alert{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:10px;
  padding:14px;
  border:1px solid #e2d9f3;
  border-radius:19px;
  background:var(--purple-bg);
  cursor:pointer;
}

.purchase-home-alert-icon{
  width:42px;
  height:42px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#fff;
  font-size:20px;
}

.purchase-home-alert-copy{
  min-width:0;
  flex:1;
}

.purchase-home-alert-copy small{
  display:block;
  margin-bottom:3px;
  color:var(--purple);
  font-size:8px;
  font-weight:800;
  letter-spacing:.7px;
}

.purchase-home-alert-copy strong{
  display:block;
  font-size:12px;
}

.purchase-home-alert-copy p{
  margin:
    3px
    0
    0;
  color:#75648a;
  font-size:10px;
  line-height:1.4;
}

.purchase-home-alert>span{
  color:var(--purple);
  font-size:23px;
}


/* =====================================================
   QUICK ACTIONS
===================================================== */

.quick-grid{
  display:grid;
  grid-template-columns:
    repeat(2,1fr);
  gap:9px;
}

.quick-grid button{
  min-height:115px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  text-align:left;
}

.quick-grid button>span{
  display:block;
  margin-bottom:16px;
  font-size:21px;
}

.quick-grid strong{
  display:block;
  margin-bottom:4px;
  font-size:13px;
}

.quick-grid small{
  font-size:9px;
}


/* =====================================================
   PAGE HEADER
===================================================== */

.page-header{
  margin:
    5px
    0
    23px;
}

.page-header>small{
  display:block;
  margin-bottom:5px;
  font-size:9px;
  font-weight:800;
  letter-spacing:.8px;
}

.page-header h1{
  margin:0;
}


/* =====================================================
   GENERIC CARD
===================================================== */

.card{
  padding:17px;
  border:1px solid var(--line);
  border-radius:21px;
  background:#fff;
}

.row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:15px;
}


/* =====================================================
   TRIP LIST
===================================================== */

.trip-list-card{
  margin-bottom:10px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:21px;
  background:#fff;
  cursor:pointer;
}

.trip-list-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:15px;
}

.trip-list-card small{
  font-size:9px;
}

.trip-list-card h3{
  margin:
    6px
    0
    5px;
  font-size:17px;
}

.trip-list-card p{
  margin:0;
  color:var(--muted);
  font-size:11px;
}

.trip-list-count{
  min-width:42px;
  padding:
    8px
    9px;
  border-radius:12px;
  background:var(--soft);
  text-align:center;
}

.trip-list-count strong{
  display:block;
  font-size:14px;
}

.trip-list-count small{
  font-size:7px;
}

.trip-list-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:15px;
  padding-top:13px;
  border-top:1px solid #f0f0ed;
}

.trip-list-meta>span{
  color:#777;
  font-size:10px;
}


/* =====================================================
   FAB
===================================================== */

.fab{
  position:fixed;
  z-index:20;
  right:max(
    calc((100vw - 430px) / 2 + 20px),
    20px
  );
  bottom:92px;
  width:55px;
  height:55px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:#171717;
  color:#fff;
  box-shadow:
    0 10px 30px
    rgba(0,0,0,.2);
  font-size:27px;
}


/* =====================================================
   BACK HEADER
===================================================== */

.back-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin:
    5px
    0
    20px;
  font-size:14px;
  font-weight:700;
}

.back-header button{
  width:40px;
  height:40px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid var(--line);
  border-radius:50%;
  background:#fff;
  color:#171717;
  font-size:23px;
}


/* =====================================================
   TRIP COVER
===================================================== */

.trip-cover{
  padding:23px;
  border-radius:25px;
  background:#171717;
  color:#fff;
}

.trip-cover .flag{
  display:block;
  margin-bottom:20px;
  font-size:28px;
}

.trip-cover h1{
  margin:
    0
    0
    7px;
  font-size:25px;
}

.trip-cover p{
  margin:0;
  color:#aaa;
  font-size:11px;
}


/* =====================================================
   PUBLISH SYSTEM
===================================================== */

.publish-card{
  margin-top:11px;
}

.publish-card small{
  display:block;
  margin-bottom:4px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.7px;
}

.publish-card h3{
  margin:
    0
    0
    4px;
  font-size:15px;
}

.publish-card p{
  max-width:230px;
  margin:0;
  color:#777;
  font-size:10px;
  line-height:1.45;
}

.publish-card .primary{
  margin-top:14px;
}

.publish-badge,
.product-status{
  display:inline-flex;
  align-items:center;
  padding:
    6px
    9px;
  border-radius:999px;
  font-size:8px;
  font-weight:800;
  white-space:nowrap;
}

.publish-badge.published,
.product-status.published{
  background:var(--green-bg);
  color:var(--green);
}

.publish-badge.draft,
.product-status.draft{
  background:#f1f1ed;
  color:#777;
}

.publish-button.unpublish{
  border:1px solid #ddd;
  background:#fff;
  color:#171717;
}

.publish-warning{
  margin-top:10px;
  padding:11px;
  border-radius:13px;
  background:var(--yellow-bg);
  color:var(--yellow);
  font-size:9px;
  line-height:1.5;
}


/* =====================================================
   TRIP SUMMARY
===================================================== */

.trip-summary{
  display:grid;
  grid-template-columns:
    repeat(3,1fr);
  gap:8px;
  margin:
    11px
    0;
}

.trip-summary>div{
  min-width:0;
  padding:14px;
  border:1px solid var(--line);
  border-radius:17px;
  background:#fff;
}

.trip-summary small{
  display:block;
  margin-bottom:6px;
  font-size:7px;
  font-weight:700;
}

.trip-summary strong{
  display:block;
  overflow:hidden;
  font-size:13px;
  text-overflow:ellipsis;
  white-space:nowrap;
}


/* =====================================================
   TABS
===================================================== */

.tabs{
  display:flex;
  gap:5px;
  margin:
    20px
    0
    14px;
  padding:4px;
  border-radius:14px;
  background:#ebebe7;
}

.tabs button{
  flex:1;
  padding:9px 5px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#777;
  font-size:10px;
  font-weight:700;
}

.tabs button.active{
  background:#fff;
  color:#171717;
  box-shadow:
    0 1px 4px
    rgba(0,0,0,.06);
}


/* =====================================================
   PRODUCT CARD
===================================================== */

.product-card{
  display:flex;
  gap:12px;
  margin-bottom:9px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:19px;
  background:#fff;
  cursor:pointer;
}

.product-thumb{
  width:68px;
  height:68px;
  flex-shrink:0;
  object-fit:cover;
  border-radius:15px;
  background:#efefeb;
}

.product-thumb-placeholder{
  width:68px;
  height:68px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#efefeb;
  font-size:25px;
}

.product-info{
  min-width:0;
  flex:1;
}

.product-info h3{
  margin:
    2px
    0
    5px;
  font-size:13px;
}

.product-info>p{
  margin:
    0
    0
    7px;
  color:#777;
  font-size:10px;
}

.product-info strong{
  font-size:12px;
}

.product-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:8px;
}

.product-meta>span{
  color:#888;
  font-size:9px;
}


/* =====================================================
   PRODUCT DETAIL
===================================================== */

.product-detail-image{
  width:100%;
  aspect-ratio:1.2/1;
  display:block;
  object-fit:cover;
  border-radius:25px;
  background:#eee;
}

.product-detail-placeholder{
  width:100%;
  aspect-ratio:1.2/1;
  display:grid;
  place-items:center;
  border-radius:25px;
  background:#eee;
  font-size:55px;
}

.product-detail-title{
  margin:
    20px
    0
    15px;
}

.product-detail-title small{
  display:block;
  margin-bottom:5px;
  font-size:9px;
}

.product-detail-title h1{
  margin:
    0
    0
    7px;
  font-size:24px;
}

.product-detail-title>strong{
  font-size:20px;
}

.inventory{
  display:grid;
  grid-template-columns:
    repeat(3,1fr);
  gap:8px;
  margin:
    14px
    0;
}

.inventory>div{
  padding:13px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
}

.inventory small{
  display:block;
  margin-bottom:5px;
  font-size:7px;
}

.inventory strong{
  font-size:15px;
}

.product-publish-card{
  margin:
    13px
    0;
}

.product-publish-action{
  margin-top:13px;
}


/* =====================================================
   PRIMARY / SECONDARY BUTTONS
===================================================== */

.primary{
  width:100%;
  padding:15px;
  border:0;
  border-radius:15px;
  background:#171717;
  color:#fff;
  font-weight:750;
}

.secondary{
  width:100%;
  padding:15px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#fff;
  color:#171717;
  font-weight:700;
}

.cancel{
  width:100%;
  margin-top:8px;
  padding:13px;
  border:0;
  background:transparent;
  color:#777;
  font-weight:650;
}


/* =====================================================
   ORDERS PAGE
===================================================== */

.order-page-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
}

.payment-pending-counter{
  display:inline-flex;
  align-items:center;
  padding:
    7px
    10px;
  border-radius:999px;
  background:var(--blue-bg);
  color:var(--blue);
  font-size:9px;
  font-weight:800;
}


/* =====================================================
   ORDER FILTER
===================================================== */

.order-filter{
  display:flex;
  gap:6px;
  overflow-x:auto;
  margin:
    -5px
    0
    17px;
  padding-bottom:2px;
  scrollbar-width:none;
}

.order-filter::-webkit-scrollbar{
  display:none;
}

.order-filter button{
  flex-shrink:0;
  padding:
    8px
    12px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#fff;
  color:#777;
  font-size:9px;
  font-weight:700;
}

.order-filter button.active{
  border-color:#171717;
  background:#171717;
  color:#fff;
}


/* =====================================================
   ORDER CARDS
===================================================== */

.order-card{
  margin-bottom:9px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  cursor:pointer;
}

.order-card.payment-submitted{
  border-color:#ccd4f4;
  background:#fbfbff;
}

.order-card-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}

.order-card small{
  font-size:8px;
}

.order-card h3{
  margin:
    5px
    0
    4px;
  font-size:14px;
}

.order-card p{
  margin:0;
  color:#777;
  font-size:10px;
}

.order-card-bottom{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:15px;
  padding-top:12px;
  border-top:1px solid #f0f0ed;
}

.order-card-bottom>div small{
  display:block;
  margin-bottom:3px;
}

.order-card-bottom strong{
  font-size:14px;
}

.order-payment-notice{
  display:flex;
  align-items:center;
  gap:7px;
  margin-top:11px;
  padding:
    8px
    10px;
  border-radius:11px;
  background:var(--blue-bg);
  color:var(--blue);
  font-size:9px;
  font-weight:700;
}


/* =====================================================
   ORDER STATUS
===================================================== */

.order-status{
  display:inline-flex;
  align-items:center;
  padding:
    6px
    9px;
  border-radius:999px;
  font-size:8px;
  font-weight:800;
  white-space:nowrap;
}

.order-status.waiting_payment{
  background:var(--yellow-bg);
  color:var(--yellow);
}

.order-status.paid{
  background:#edf2ff;
  color:#45579d;
}

.order-status.purchased{
  background:var(--purple-bg);
  color:var(--purple);
}

.order-status.arrived{
  background:#eaf7f6;
  color:#24736d;
}

.order-status.ready_to_ship{
  background:#eef6ff;
  color:#36709d;
}

.order-status.shipped{
  background:#eef1f5;
  color:#526274;
}

.order-status.completed{
  background:var(--green-bg);
  color:var(--green);
}

.order-status.cancelled{
  background:var(--red-bg);
  color:var(--red);
}


/* =====================================================
   ORDER DETAIL
===================================================== */

.order-detail-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:13px;
}

.order-detail-head small{
  display:block;
  margin-bottom:5px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.7px;
}

.order-detail-head h1{
  margin:
    0
    0
    5px;
  font-size:21px;
}

.order-detail-head p{
  margin:0;
  color:#888;
  font-size:9px;
}

.order-detail-card{
  margin-bottom:10px;
}

.detail-label{
  display:block;
  margin-bottom:9px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.8px;
}

.detail-main-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
}

.detail-main-row h3,
.order-detail-card>h3{
  margin:
    0
    0
    4px;
  font-size:14px;
}

.detail-main-row p,
.order-detail-card>p{
  margin:0;
  color:#777;
  font-size:10px;
}

.mini-action{
  flex-shrink:0;
  padding:
    9px
    11px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#f7f7f5;
  color:#171717;
  font-size:9px;
  font-weight:700;
}


/* =====================================================
   ORDER ITEMS
===================================================== */

.order-detail-item{
  display:flex;
  justify-content:space-between;
  gap:15px;
  padding:
    10px
    0;
  border-bottom:1px solid #f0f0ed;
}

.order-detail-item:last-of-type{
  border-bottom:0;
}

.order-detail-item>div{
  min-width:0;
}

.order-detail-item h4{
  margin:
    0
    0
    4px;
  font-size:12px;
}

.order-detail-item p{
  margin:0;
  color:#888;
  font-size:9px;
}

.order-detail-item>strong{
  flex-shrink:0;
  font-size:11px;
}

.order-total-row{
  display:flex;
  justify-content:space-between;
  gap:15px;
  margin-top:8px;
  padding-top:14px;
  border-top:1px solid var(--line);
  font-size:14px;
}

.order-total-row strong{
  font-size:17px;
}


/* =====================================================
   SELLER PAYMENT VERIFICATION
===================================================== */

.seller-payment-card{
  margin-bottom:10px;
}

.seller-payment-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.seller-payment-head .detail-label{
  margin-bottom:4px;
}

.seller-payment-head h3{
  margin:0;
  font-size:15px;
}

.seller-payment-description{
  margin:
    9px
    0
    14px;
  color:#777;
  font-size:10px;
  line-height:1.5;
}


/* =====================================================
   PAYMENT REVIEW BADGE
===================================================== */

.payment-review-badge{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  padding:
    6px
    9px;
  border-radius:999px;
  font-size:8px;
  font-weight:800;
  white-space:nowrap;
}

.payment-review-badge.waiting{
  background:var(--yellow-bg);
  color:var(--yellow);
}

.payment-review-badge.submitted{
  background:var(--blue-bg);
  color:var(--blue);
}

.payment-review-badge.verified{
  background:var(--green-bg);
  color:var(--green);
}

.payment-review-badge.rejected{
  background:var(--red-bg);
  color:var(--red);
}


/* =====================================================
   PAYMENT EMPTY
===================================================== */

.payment-empty{
  display:flex;
  align-items:center;
  gap:11px;
  padding:13px;
  border-radius:15px;
  background:#f7f7f5;
}

.payment-empty-icon{
  width:37px;
  height:37px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#fff;
  font-size:17px;
}

.payment-empty strong{
  display:block;
  margin-bottom:3px;
  font-size:10px;
}

.payment-empty p{
  margin:0;
  color:#888;
  font-size:9px;
}


/* =====================================================
   PAYMENT PROOF
===================================================== */

.payment-proof-meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  margin-bottom:9px;
  font-size:9px;
}

.payment-proof-meta span{
  color:#888;
}

.payment-proof-meta strong{
  text-align:right;
}

.seller-proof-image-button{
  position:relative;
  width:100%;
  overflow:hidden;
  padding:0;
  border:1px solid var(--line);
  border-radius:17px;
  background:#f1f1ed;
}

.seller-proof-image-button img,
.seller-proof-image-button iframe{
  width:100%;
  height:280px;
  max-height:390px;
  display:block;
  border:0;
  object-fit:contain;
  background:#f0f0ed;
  pointer-events:none;
}

.seller-proof-image-button>span{
  position:absolute;
  right:9px;
  bottom:9px;
  padding:
    6px
    9px;
  border-radius:999px;
  background:rgba(0,0,0,.72);
  color:#fff;
  font-size:8px;
}


/* =====================================================
   PAYMENT REVIEW ACTIONS
===================================================== */

.payment-review-actions{
  display:grid;
  grid-template-columns:
    1fr
    1fr;
  gap:8px;
  margin-top:11px;
}

.reject-payment-button,
.confirm-payment-button{
  min-height:44px;
  border-radius:13px;
  font-size:10px;
  font-weight:750;
}

.reject-payment-button{
  border:1px solid #efcaca;
  background:#fff7f7;
  color:var(--red);
}

.confirm-payment-button{
  border:0;
  background:#171717;
  color:#fff;
}


/* =====================================================
   VERIFIED / REJECTED PAYMENT BOX
===================================================== */

.payment-verified-box,
.payment-rejected-box{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin-top:10px;
  padding:13px;
  border-radius:15px;
}

.payment-verified-box{
  border:1px solid #cfe7d8;
  background:var(--green-bg);
}

.payment-rejected-box{
  border:1px solid #f0caca;
  background:var(--red-bg);
}

.payment-state-icon{
  width:34px;
  height:34px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border-radius:50%;
  font-weight:800;
}

.payment-verified-box
.payment-state-icon{
  background:var(--green);
  color:#fff;
}

.payment-rejected-box
.payment-state-icon{
  background:var(--red);
  color:#fff;
}

.payment-verified-box strong,
.payment-rejected-box strong{
  display:block;
  margin:
    1px
    0
    4px;
  font-size:11px;
}

.payment-verified-box strong{
  color:var(--green);
}

.payment-rejected-box strong{
  color:var(--red);
}

.payment-verified-box p,
.payment-rejected-box p{
  margin:0;
  font-size:9px;
  line-height:1.45;
}

.payment-verified-box p{
  color:#55715f;
}

.payment-rejected-box p{
  color:#875858;
}


/* =====================================================
   V4.4 ORDER PURCHASE CARD
===================================================== */

.order-purchase-card{
  margin-bottom:10px;
  border-color:#e4dbf0;
}

.order-purchase-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.order-purchase-head .detail-label{
  margin-bottom:4px;
}

.order-purchase-head h3{
  margin:0;
  font-size:15px;
}

.order-purchase-card>p{
  margin:
    9px
    0
    13px;
  color:#777;
  font-size:10px;
  line-height:1.5;
}

.purchase-status-badge{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  padding:
    6px
    9px;
  border-radius:999px;
  font-size:8px;
  font-weight:800;
}

.purchase-status-badge.pending{
  background:var(--yellow-bg);
  color:var(--yellow);
}

.purchase-status-badge.partial{
  background:var(--purple-bg);
  color:var(--purple);
}

.purchase-status-badge.complete{
  background:var(--green-bg);
  color:var(--green);
}

.order-purchase-items{
  overflow:hidden;
  margin-bottom:12px;
  border:1px solid var(--line);
  border-radius:14px;
}

.order-purchase-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:
    10px
    11px;
  border-bottom:1px solid var(--line);
}

.order-purchase-item:last-child{
  border-bottom:0;
}

.order-purchase-item>div{
  min-width:0;
}

.order-purchase-item strong{
  display:block;
  overflow:hidden;
  margin-bottom:3px;
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.order-purchase-item small{
  display:block;
  font-size:8px;
}

.order-purchase-item>span{
  flex-shrink:0;
  font-size:9px;
  font-weight:750;
}

.purchase-open-button{
  width:100%;
  padding:12px;
  border:0;
  border-radius:13px;
  background:var(--purple-bg);
  color:var(--purple);
  font-size:10px;
  font-weight:800;
}


/* =====================================================
   ORDER PROCESS
===================================================== */

.order-process-card{
  margin-bottom:10px;
}

.order-progress{
  margin:
    5px
    0
    17px;
}

.progress-item{
  position:relative;
  display:flex;
  gap:11px;
  min-height:42px;
}

.progress-item:last-child{
  min-height:auto;
}

.progress-item::before{
  content:"";
  position:absolute;
  top:18px;
  left:8px;
  width:1px;
  height:calc(100% - 3px);
  background:#ddd;
}

.progress-item:last-child::before{
  display:none;
}

.progress-dot{
  position:relative;
  z-index:2;
  width:17px;
  height:17px;
  flex-shrink:0;
  display:grid;
  place-items:center;
  border:2px solid #ccc;
  border-radius:50%;
  background:#fff;
}

.progress-item.done
.progress-dot{
  border-color:#171717;
  background:#171717;
}

.progress-item.current
.progress-dot{
  border-color:#171717;
}

.progress-content{
  padding-bottom:12px;
}

.progress-content strong{
  display:block;
  margin-bottom:2px;
  font-size:10px;
}

.progress-content small{
  font-size:8px;
}

.progress-item.pending
.progress-content{
  opacity:.42;
}

.cancel-order-button{
  width:100%;
  margin-top:8px;
  padding:13px;
  border:1px solid #efcece;
  border-radius:13px;
  background:#fff7f7;
  color:var(--red);
  font-size:10px;
  font-weight:700;
}


/* =====================================================
   V4.4 PURCHASE SUMMARY
===================================================== */

.purchase-summary{
  display:grid;
  grid-template-columns:
    .8fr
    .8fr
    1.4fr;
  gap:7px;
  margin-bottom:13px;
}

.purchase-summary>div{
  min-width:0;
  padding:
    13px
    10px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
}

.purchase-summary small{
  display:block;
  margin-bottom:6px;
  font-size:7px;
  font-weight:750;
}

.purchase-summary strong{
  display:block;
  overflow:hidden;
  font-size:13px;
  text-overflow:ellipsis;
  white-space:nowrap;
}


/* =====================================================
   V4.4 PURCHASE FILTER
===================================================== */

.purchase-filter{
  display:grid;
  grid-template-columns:
    1fr
    1fr;
  gap:5px;
  margin-bottom:13px;
  padding:4px;
  border-radius:14px;
  background:#ebebe7;
}

.purchase-filter button{
  padding:
    9px
    7px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#777;
  font-size:9px;
  font-weight:750;
}

.purchase-filter button.active{
  background:#fff;
  color:#171717;
  box-shadow:
    0 1px 4px
    rgba(0,0,0,.06);
}


/* =====================================================
   V4.4 NEED TO BUY CARD
===================================================== */

.purchase-need-card{
  margin-bottom:9px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:19px;
  background:#fff;
}

.purchase-need-top{
  display:flex;
  gap:11px;
}

.purchase-need-image,
.purchase-need-placeholder{
  width:58px;
  height:58px;
  flex-shrink:0;
  border-radius:14px;
  background:#f0f0ed;
}

.purchase-need-image{
  display:block;
  object-fit:cover;
}

.purchase-need-placeholder{
  display:grid;
  place-items:center;
  font-size:23px;
}

.purchase-need-info{
  min-width:0;
  flex:1;
}

.purchase-need-info small{
  display:block;
  margin-bottom:3px;
  font-size:8px;
}

.purchase-need-info h3{
  margin:
    0
    0
    5px;
  font-size:12px;
}

.purchase-need-info p{
  margin:0;
  color:#777;
  font-size:9px;
}

.purchase-qty-progress{
  display:grid;
  grid-template-columns:
    repeat(3,1fr);
  gap:6px;
  margin-top:12px;
}

.purchase-qty-progress>div{
  padding:
    9px
    8px;
  border-radius:12px;
  background:#f7f7f5;
}

.purchase-qty-progress small{
  display:block;
  margin-bottom:4px;
  font-size:7px;
}

.purchase-qty-progress strong{
  font-size:11px;
}

.purchase-need-cost{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-top:11px;
  padding-top:11px;
  border-top:1px solid #f0f0ed;
}

.purchase-need-cost small{
  display:block;
  margin-bottom:3px;
  font-size:7px;
}

.purchase-need-cost strong{
  font-size:11px;
}

.record-purchase-button{
  flex-shrink:0;
  padding:
    10px
    12px;
  border:0;
  border-radius:12px;
  background:#171717;
  color:#fff;
  font-size:9px;
  font-weight:750;
}


/* =====================================================
   V4.4 PURCHASE HISTORY CARD
===================================================== */

.purchase-history-card{
  margin-bottom:9px;
  padding:15px;
  border:1px solid var(--line);
  border-radius:19px;
  background:#fff;
  cursor:pointer;
}

.purchase-history-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
}

.purchase-history-head>div{
  min-width:0;
}

.purchase-history-head small{
  display:block;
  margin-bottom:4px;
  font-size:7px;
}

.purchase-history-head h3{
  margin:
    0
    0
    4px;
  font-size:12px;
}

.purchase-history-head p{
  margin:0;
  color:#888;
  font-size:8px;
}

.purchase-history-qty{
  flex-shrink:0;
  padding:
    6px
    9px;
  border-radius:999px;
  background:var(--purple-bg);
  color:var(--purple);
  font-size:8px;
  font-weight:800;
}

.purchase-history-cost{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-top:12px;
  padding-top:11px;
  border-top:1px solid #f0f0ed;
}

.purchase-history-cost span{
  color:#777;
  font-size:9px;
}

.purchase-history-cost strong{
  font-size:11px;
}


/* =====================================================
   V4.4 PURCHASE MODAL
===================================================== */

.purchase-sheet{
  padding-bottom:
    calc(
      30px +
      env(safe-area-inset-bottom)
    );
}

.purchase-sheet
.sheet-title small,
.purchase-detail-sheet
.sheet-title small{
  display:block;
  margin-bottom:4px;
  color:var(--purple);
  font-size:8px;
  font-weight:800;
  letter-spacing:.8px;
}

.purchase-product-summary{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:18px;
  padding:12px;
  border-radius:17px;
  background:#f7f7f5;
}

.purchase-product-image-wrap{
  position:relative;
  width:58px;
  height:58px;
  flex-shrink:0;
  overflow:hidden;
  border-radius:14px;
  background:#ecece8;
}

.purchase-product-image-wrap img{
  width:100%;
  height:100%;
  display:none;
  object-fit:cover;
}

.purchase-product-image-wrap span{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-size:23px;
}

.purchase-product-summary>div:last-child{
  min-width:0;
}

.purchase-product-summary small{
  display:block;
  margin-bottom:4px;
  font-size:7px;
  font-weight:750;
}

.purchase-product-summary h3{
  margin:
    0
    0
    4px;
  font-size:12px;
}

.purchase-product-summary p{
  margin:0;
  color:#888;
  font-size:9px;
}


/* =====================================================
   V4.4 PURCHASE REQUIREMENT
===================================================== */

.purchase-requirement{
  display:grid;
  grid-template-columns:
    repeat(3,1fr);
  gap:7px;
  margin-top:11px;
}

.purchase-requirement>div{
  padding:
    11px
    9px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
}

.purchase-requirement small{
  display:block;
  margin-bottom:5px;
  font-size:7px;
  font-weight:750;
}

.purchase-requirement strong{
  font-size:13px;
}

.purchase-requirement>div:last-child{
  background:var(--purple-bg);
}

.purchase-requirement>div:last-child strong{
  color:var(--purple);
}


/* =====================================================
   V4.4 PURCHASE RATE
===================================================== */

.purchase-rate-hint{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:7px;
  padding:
    0
    2px;
  color:#888;
  font-size:8px;
}

.purchase-rate-hint strong{
  color:#666;
}


/* =====================================================
   V4.4 PURCHASE COST CALCULATOR
===================================================== */

.purchase-cost-calculator{
  overflow:hidden;
  margin-top:15px;
  border:1px solid var(--line);
  border-radius:16px;
}

.purchase-cost-calculator>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:
    11px
    12px;
  border-bottom:1px solid var(--line);
  font-size:10px;
}

.purchase-cost-calculator>div:last-child{
  border-bottom:0;
}

.purchase-cost-calculator span{
  color:#777;
}

.purchase-cost-calculator strong{
  text-align:right;
}

.purchase-cost-calculator .total{
  padding:
    13px
    12px;
  background:#f4f4f0;
}

.purchase-cost-calculator .total strong{
  font-size:14px;
}


/* =====================================================
   V4.4 PURCHASE RECEIPT
===================================================== */

.optional-label{
  display:inline;
  margin-left:4px;
  color:#aaa;
  font-size:8px;
  font-weight:500;
}

.purchase-receipt-upload{
  position:relative;
  width:100%;
  min-height:145px;
  display:grid !important;
  place-items:center;
  overflow:hidden;
  margin-top:8px !important;
  border:1.5px dashed #ccc;
  border-radius:17px;
  background:#f7f7f5;
  cursor:pointer;
}

.purchase-receipt-upload input{
  display:none;
}

.purchase-receipt-upload img{
  width:100%;
  max-height:300px;
  display:none;
  object-fit:contain;
  background:#eee;
}

#purchaseReceiptPlaceholder{
  padding:22px;
  text-align:center;
}

#purchaseReceiptPlaceholder span{
  display:block;
  font-size:27px;
}

#purchaseReceiptPlaceholder p{
  margin:
    7px
    0
    3px;
  color:#777;
  font-size:10px;
}

#purchaseReceiptPlaceholder small{
  font-size:8px;
}


/* =====================================================
   V4.4 PURCHASE ALLOCATION INFO
===================================================== */

.purchase-allocation-info{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin-top:14px;
  padding:
    11px
    12px;
  border-radius:13px;
  background:var(--blue-bg);
}

.purchase-allocation-info>span{
  flex-shrink:0;
  font-size:13px;
}

.purchase-allocation-info p{
  margin:0;
  color:#687093;
  font-size:8px;
  line-height:1.5;
}


/* =====================================================
   V4.4 PURCHASE DETAIL
===================================================== */

.purchase-detail-sheet{
  padding-bottom:
    calc(
      25px +
      env(safe-area-inset-bottom)
    );
}

.purchase-detail-block{
  margin-top:13px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:17px;
}

.purchase-detail-block>small{
  display:block;
  margin-bottom:8px;
  font-size:7px;
  font-weight:800;
  letter-spacing:.7px;
}

.purchase-detail-block h3{
  margin:
    0
    0
    5px;
  font-size:13px;
}

.purchase-detail-block p{
  margin:0;
  color:#777;
  font-size:9px;
  line-height:1.5;
}

.purchase-detail-row{
  display:flex;
  justify-content:space-between;
  gap:15px;
  padding:
    8px
    0;
  border-bottom:1px solid #f0f0ed;
  font-size:9px;
}

.purchase-detail-row:last-child{
  border-bottom:0;
}

.purchase-detail-row span{
  color:#777;
}

.purchase-detail-row strong{
  max-width:60%;
  text-align:right;
}

.purchase-detail-receipt{
  width:100%;
  overflow:hidden;
  margin-top:10px;
  padding:0;
  border:1px solid var(--line);
  border-radius:15px;
  background:#f1f1ed;
}

.purchase-detail-receipt img{
  width:100%;
  max-height:300px;
  display:block;
  object-fit:contain;
}

.purchase-allocation-list{
  overflow:hidden;
  margin-top:8px;
  border:1px solid var(--line);
  border-radius:13px;
}

.purchase-allocation-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:
    9px
    10px;
  border-bottom:1px solid var(--line);
}

.purchase-allocation-row:last-child{
  border-bottom:0;
}

.purchase-allocation-row>div{
  min-width:0;
}

.purchase-allocation-row strong{
  display:block;
  margin-bottom:2px;
  font-size:9px;
}

.purchase-allocation-row small{
  font-size:7px;
}

.purchase-allocation-row>span{
  flex-shrink:0;
  font-size:9px;
  font-weight:750;
}


/* =====================================================
   EMPTY
===================================================== */

.empty{
  padding:
    45px
    20px;
  text-align:center;
  color:#888;
}

.empty>span{
  display:block;
  font-size:35px;
}

.empty h3{
  margin:
    13px
    0
    6px;
  color:#171717;
  font-size:15px;
}

.empty p{
  margin:0;
  font-size:10px;
  line-height:1.5;
}


/* =====================================================
   BUSINESS
===================================================== */

.business-profile{
  padding:
    25px
    0
    28px;
  text-align:center;
}

.business-avatar{
  width:70px;
  height:70px;
  display:grid;
  place-items:center;
  margin:
    0
    auto
    12px;
  border-radius:22px;
  background:#171717;
  color:#fff;
  font-size:22px;
  font-weight:800;
}

.business-profile h2{
  margin:
    0
    0
    4px;
  font-size:20px;
}

.business-profile small{
  font-size:10px;
}

.plan{
  padding:19px;
  border-radius:21px;
  background:#171717;
  color:#fff;
}

.plan small{
  color:#888;
  font-size:8px;
  font-weight:800;
  letter-spacing:.8px;
}

.plan h2{
  margin:
    6px
    0;
}

.plan p{
  margin:0;
  color:#aaa;
  font-size:10px;
  line-height:1.5;
}

.menu{
  overflow:hidden;
  margin-top:13px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
}

.menu button{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  padding:
    15px
    16px;
  border:0;
  border-bottom:1px solid #efefec;
  background:#fff;
  color:#171717;
  text-align:left;
  font-size:11px;
}

.menu button:last-child{
  border-bottom:0;
}

.menu button b{
  color:#aaa;
  font-size:17px;
}


/* =====================================================
   BOTTOM NAV
===================================================== */

.bottom-nav{
  position:fixed;
  z-index:40;
  left:50%;
  bottom:0;
  width:min(100%,430px);
  height:76px;
  display:grid;
  grid-template-columns:
    repeat(4,1fr);
  padding:
    7px
    8px
    max(7px,env(safe-area-inset-bottom));
  border-top:1px solid var(--line);
  background:
    rgba(255,255,255,.96);
  backdrop-filter:blur(16px);
  transform:translateX(-50%);
}

.bottom-nav button{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  border:0;
  background:transparent;
  color:#aaa;
  font-size:8px;
  font-weight:650;
}

.bottom-nav button>span{
  font-size:17px;
}

.bottom-nav button.active{
  color:#171717;
}

.nav-icon-wrap{
  position:relative;
  display:inline-flex;
}

.nav-icon-wrap>span{
  font-size:17px;
}

.nav-notification{
  position:absolute;
  top:-8px;
  right:-12px;
  min-width:17px;
  height:17px;
  display:grid;
  place-items:center;
  padding:
    0
    4px;
  border:2px solid #fff;
  border-radius:999px;
  background:#d94b4b;
  color:#fff;
  font-size:7px;
  font-style:normal;
  font-weight:800;
}


/* =====================================================
   OVERLAY / SHEET
===================================================== */

.overlay{
  position:fixed;
  z-index:80;
  inset:0;
  display:none;
  align-items:flex-end;
  justify-content:center;
  padding-top:30px;
  background:
    rgba(0,0,0,.42);
}

.overlay.show{
  display:flex;
}

.sheet{
  width:100%;
  max-width:430px;
  max-height:92vh;
  overflow-y:auto;
  padding:
    22px
    20px
    calc(
      22px +
      env(safe-area-inset-bottom)
    );
  border-radius:
    25px
    25px
    0
    0;
  background:#fff;
}

.sheet h2{
  margin:
    0
    0
    20px;
  font-size:21px;
}

.sheet label{
  display:block;
  margin:
    14px
    0
    7px;
  color:#555;
  font-size:10px;
  font-weight:700;
}

.sheet input,
.sheet select,
.sheet textarea{
  width:100%;
  padding:
    13px
    14px;
  border:1px solid #ddd;
  border-radius:13px;
  outline:none;
  background:#fafafa;
}

.sheet input:focus,
.sheet select:focus,
.sheet textarea:focus{
  border-color:#aaa;
  background:#fff;
}

.sheet input[readonly]{
  color:#777;
  background:#f1f1ed;
}

.sheet>.primary{
  margin-top:19px;
}

.sheet-title{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:15px;
}

.sheet-title h2{
  margin:0;
}

.sheet-title>button{
  width:35px;
  height:35px;
  flex-shrink:0;
  padding:0;
  border:0;
  border-radius:50%;
  background:#f1f1ed;
  color:#171717;
  font-size:19px;
}


/* =====================================================
   PRODUCT FORM
===================================================== */

.product-sheet{
  padding-bottom:
    calc(
      30px +
      env(safe-area-inset-bottom)
    );
}

.photo-upload{
  position:relative;
  width:100%;
  min-height:180px;
  display:grid !important;
  place-items:center;
  overflow:hidden;
  margin-top:8px !important;
  border:1.5px dashed #ccc;
  border-radius:18px;
  background:#f7f7f5;
  cursor:pointer;
}

.photo-upload input{
  display:none;
}

.photo-upload img{
  width:100%;
  max-height:340px;
  display:none;
  object-fit:contain;
  background:#eee;
}

#photoPlaceholder{
  padding:25px;
  text-align:center;
}

#photoPlaceholder span{
  display:block;
  font-size:30px;
}

#photoPlaceholder p{
  margin:
    8px
    0
    0;
  color:#888;
  font-size:10px;
}

#photoPlaceholder small{
  font-size:8px;
}

.form-row{
  display:grid;
  grid-template-columns:
    1fr
    1fr;
  gap:9px;
}

.markup-options{
  display:grid;
  grid-template-columns:
    repeat(4,1fr);
  gap:6px;
}

.markup-options button{
  padding:
    10px
    5px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#f7f7f5;
  color:#666;
  font-size:9px;
  font-weight:700;
}

.markup-options button.active{
  border-color:#171717;
  background:#171717;
  color:#fff;
}

.price-calculator{
  overflow:hidden;
  margin-top:15px;
  border:1px solid var(--line);
  border-radius:16px;
}

.price-calculator>div{
  display:flex;
  justify-content:space-between;
  gap:15px;
  padding:
    10px
    12px;
  border-bottom:1px solid var(--line);
  font-size:10px;
}

.price-calculator>div:last-child{
  border-bottom:0;
}

.price-calculator span{
  color:#777;
}

.price-calculator .total{
  padding:
    13px
    12px;
  background:#f4f4f0;
}

.price-calculator .total strong{
  font-size:13px;
}


/* =====================================================
   LIVE RATE PANEL
===================================================== */

.rate-panel{
  margin-top:14px;
  padding:13px;
  border:1px solid var(--line);
  border-radius:15px;
  background:#f7f7f5;
}

.rate-panel-top{
  display:flex;
  justify-content:space-between;
  gap:12px;
}

.rate-panel small{
  display:block;
  font-size:8px;
}

.rate-panel strong{
  display:block;
  margin-top:4px;
  font-size:12px;
}

.rate-panel p{
  margin:
    7px
    0
    0;
  color:#888;
  font-size:8px;
  line-height:1.45;
}


/* =====================================================
   REJECT PAYMENT MODAL
===================================================== */

.reject-payment-sheet
.sheet-title small{
  display:block;
  margin-bottom:4px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.8px;
}

.reject-payment-copy{
  margin:
    15px
    0;
  color:#777;
  font-size:10px;
  line-height:1.5;
}

.reject-reason-options{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:9px;
}

.reject-reason-options button{
  padding:
    8px
    10px;
  border:1px solid var(--line);
  border-radius:999px;
  background:#f7f7f5;
  color:#555;
  font-size:8px;
}

.reject-confirm-button{
  width:100%;
  margin-top:18px;
  padding:14px;
  border:0;
  border-radius:14px;
  background:var(--red);
  color:#fff;
  font-weight:750;
}


/* =====================================================
   CONFIRM PAYMENT
===================================================== */

.confirm-payment-sheet{
  text-align:center;
}

.confirm-payment-icon{
  width:56px;
  height:56px;
  display:grid;
  place-items:center;
  margin:
    3px
    auto
    14px;
  border-radius:50%;
  background:#171717;
  color:#fff;
  font-size:22px;
  font-weight:800;
}

.confirm-payment-sheet h2{
  margin-bottom:8px;
}

.confirm-payment-sheet p{
  max-width:320px;
  margin:
    0
    auto
    20px;
  color:#777;
  font-size:10px;
  line-height:1.55;
}


/* =====================================================
   PAYMENT / RECEIPT FULL VIEWER
===================================================== */

.proof-viewer{
  position:fixed;
  z-index:120;
  inset:0;
  display:none;
  flex-direction:column;
  background:
    rgba(10,10,10,.98);
}

.proof-viewer.show{
  display:flex;
}

.proof-viewer-header{
  display:flex;
  align-items:center;
  gap:12px;
  padding:
    max(
      16px,
      env(safe-area-inset-top)
    )
    17px
    14px;
  color:#fff;
}

.proof-viewer-header button{
  width:39px;
  height:39px;
  flex-shrink:0;
  padding:0;
  border:0;
  border-radius:50%;
  background:#2a2a2a;
  color:#fff;
  font-size:21px;
}

.proof-viewer-header strong{
  display:block;
  font-size:12px;
}

.proof-viewer-header small{
  display:block;
  margin-top:2px;
  color:#888;
  font-size:8px;
}

.proof-viewer-body{
  min-height:0;
  flex:1;
  display:grid;
  place-items:center;
  overflow:auto;
  padding:
    10px
    14px
    25px;
}

.proof-viewer-body img{
  max-width:100%;
  max-height:calc(100vh - 100px);
  object-fit:contain;
}


/* =====================================================
   TOAST
===================================================== */

.toast{
  position:fixed;
  z-index:200;
  top:20px;
  left:50%;
  max-width:calc(100% - 40px);
  padding:
    11px
    17px;
  border-radius:999px;
  background:#171717;
  color:#fff;
  box-shadow:
    0 7px 25px
    rgba(0,0,0,.18);
  font-size:10px;
  text-align:center;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transform:
    translate(
      -50%,
      -90px
    );
  transition:.25s;
}

.toast.show{
  opacity:1;
  transform:
    translate(
      -50%,
      0
    );
}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media(max-width:360px){

  .screen{
    padding-left:16px;
    padding-right:16px;
  }

  .stats{
    gap:6px;
  }

  .stat{
    padding:
      12px
      8px;
  }

  .stat strong{
    font-size:12px;
  }

  .quick-grid{
    gap:7px;
  }

  .quick-grid button{
    min-height:108px;
    padding:14px;
  }

  .trip-summary{
    gap:6px;
  }

  .trip-summary>div{
    padding:
      12px
      9px;
  }

  .payment-review-actions{
    grid-template-columns:1fr;
  }

  .seller-payment-head{
    display:block;
  }

  .payment-review-badge{
    margin-top:9px;
  }

  .purchase-summary{
    grid-template-columns:
      1fr
      1fr;
  }

  .purchase-summary>div:last-child{
    grid-column:
      1 /
      -1;
  }

  .purchase-requirement{
    gap:5px;
  }

  .purchase-requirement>div{
    padding:
      10px
      7px;
  }

  .purchase-qty-progress{
    gap:5px;
  }

  .purchase-need-cost{
    align-items:flex-start;
    flex-direction:column;
  }

  .record-purchase-button{
    width:100%;
  }

  .order-purchase-head{
    display:block;
  }

  .purchase-status-badge{
    margin-top:8px;
  }

}


/* =====================================================
   DESKTOP PREVIEW
===================================================== */

@media(min-width:431px){

  .app{
    box-shadow:
      0
      0
      40px
      rgba(0,0,0,.08);
  }

}


/* =====================================================
   V5 MOBILE POLISH
   Seller App — responsive visual overhaul
===================================================== */

:root{
  --radius-xs:10px;
  --radius-sm:14px;
  --radius-md:18px;
  --radius-lg:24px;
  --shadow-card:0 1px 2px rgba(17,17,17,.03),0 8px 28px rgba(17,17,17,.035);
}

html{
  background:#e9e9e6;
}

body{
  overflow-x:hidden;
  font-size:14px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

.app{
  overflow-x:hidden;
}

.screen{
  padding:20px 18px calc(104px + env(safe-area-inset-bottom));
}

h1{font-size:27px}
h2{font-size:21px}
h3{line-height:1.3}

.card,
.trip-list-card,
.product-card,
.order-card,
.publish-card,
.stat,
.trip-summary>div,
.menu{
  box-shadow:var(--shadow-card);
}

/* Trip detail */
.trip-cover{
  padding:22px 20px;
  border-radius:0 0 28px 28px;
  margin:-20px -18px 0;
}

.trip-cover .flag{
  margin-bottom:18px;
}

.trip-cover h1{
  font-size:27px;
  line-height:1.1;
}

.publish-card{
  margin-top:14px;
  padding:18px;
}

.trip-summary{
  gap:9px;
  margin:14px 0 0;
}

.trip-summary>div{
  min-height:86px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:13px 12px;
  border-radius:19px;
}

.trip-summary small{
  font-size:7px;
  letter-spacing:.45px;
}

.trip-summary strong{
  font-size:14px;
}

.tabs{
  position:sticky;
  z-index:12;
  top:0;
  gap:3px;
  margin:18px -2px 18px;
  padding:4px;
  border-radius:16px;
  background:rgba(235,235,231,.96);
  backdrop-filter:blur(12px);
}

.tabs button{
  min-width:0;
  padding:11px 4px;
  border-radius:12px;
  font-size:10px;
  white-space:nowrap;
}

/* Purchase + Arrival common heading */
.purchase-heading{
  margin:4px 0 18px;
}

.purchase-heading small{
  display:block;
  margin-bottom:5px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.8px;
}

.purchase-heading h2{
  margin:0 0 7px;
  font-size:24px;
  letter-spacing:-.7px;
}

.purchase-heading p{
  max-width:340px;
  margin:0;
  color:#777;
  font-size:11px;
  line-height:1.55;
}

.purchase-summary-grid,
.purchase-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:15px 0 24px;
}

.purchase-summary-card,
.purchase-summary>div{
  min-width:0;
  min-height:88px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:13px 10px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:var(--shadow-card);
}

.purchase-summary-card small,
.purchase-summary>div small{
  display:block;
  margin-bottom:6px;
  color:#8a8a86;
  font-size:7px;
  font-weight:800;
  letter-spacing:.45px;
  line-height:1.25;
}

.purchase-summary-card strong,
.purchase-summary>div strong{
  display:block;
  overflow:hidden;
  color:#171717;
  font-size:18px;
  line-height:1.1;
  text-overflow:ellipsis;
}

.purchase-summary-card span,
.purchase-summary>div span{
  display:block;
  margin-top:3px;
  color:#999;
  font-size:8px;
}

.purchase-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin:24px 1px 12px;
}

.purchase-section-head>div{
  min-width:0;
}

.purchase-section-head small{
  display:block;
  margin-bottom:4px;
  font-size:7px;
  font-weight:800;
  letter-spacing:.75px;
}

.purchase-section-head h3{
  margin:0;
  font-size:17px;
}

.purchase-count-badge{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:27px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--purple-bg);
  color:var(--purple);
  font-size:8px;
  font-weight:800;
}

.purchase-count-badge.neutral{
  background:var(--soft);
  color:#777;
}

/* Purchase / Arrival list cards */
.purchase-item-card,
.purchase-history-card{
  width:100%;
  overflow:hidden;
  margin:0 0 10px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow-card);
  color:var(--text);
  text-align:left;
}

.purchase-item-main{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

.purchase-item-image{
  width:64px;
  height:64px;
  flex:0 0 64px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:16px;
  background:#f0f0ec;
}

.purchase-item-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.purchase-item-image span{
  font-size:24px;
}

.purchase-item-copy{
  min-width:0;
  flex:1;
}

.purchase-item-copy small{
  display:block;
  overflow:hidden;
  margin-bottom:4px;
  font-size:7px;
  font-weight:800;
  letter-spacing:.55px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.purchase-item-copy h3{
  overflow:hidden;
  margin:0 0 5px;
  font-size:13px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.purchase-item-copy p{
  margin:0;
  color:#888;
  font-size:9px;
}

.purchase-item-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
  margin-top:13px;
}

.purchase-item-stats>div{
  min-width:0;
  padding:10px 8px;
  border-radius:13px;
  background:#f7f7f4;
}

.purchase-item-stats small{
  display:block;
  overflow:hidden;
  margin-bottom:4px;
  color:#999;
  font-size:6.5px;
  font-weight:800;
  letter-spacing:.35px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.purchase-item-stats strong{
  display:block;
  font-size:14px;
}

.purchase-item-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:13px;
  padding-top:12px;
  border-top:1px solid #efefec;
}

.purchase-item-footer>div{
  min-width:0;
}

.purchase-item-footer small{
  display:block;
  margin-bottom:3px;
  font-size:7px;
  font-weight:750;
}

.purchase-item-footer strong{
  display:block;
  font-size:12px;
}

.purchase-item-footer .mini-action{
  min-height:38px;
  padding:9px 13px;
  border-radius:12px;
}

/* V4.5.1 buyer/order allocation */
.arrival-item-card{
  padding:14px;
}

.arrival-allocation-row{
  margin:0 !important;
  padding:11px 0 !important;
  border-top:1px solid #efefec !important;
}

.arrival-allocation-row:first-child{
  margin-top:4px !important;
}

.arrival-allocation-row strong{
  font-size:11px;
}

.arrival-allocation-row small{
  color:#92928d;
  font-size:7px;
}

.arrival-allocation-row .purchase-count-badge{
  min-height:24px;
  padding:5px 8px;
  font-size:7px;
}

/* Notices */
.order-payment-notice{
  flex-wrap:wrap;
  margin-top:10px;
  padding:9px 10px;
  border-radius:12px;
  line-height:1.4;
}

/* History */
.purchase-history-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
}

.purchase-history-card>div:first-child{
  min-width:0;
  flex:1;
}

.purchase-history-card small{
  display:block;
  margin-bottom:4px;
  font-size:7px;
}

.purchase-history-card h3{
  overflow:hidden;
  margin:0 0 4px;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.purchase-history-card p{
  margin:0;
  color:#777;
  font-size:9px;
}

.purchase-history-total{
  flex-shrink:0;
  display:flex;
  align-items:center;
  gap:10px;
}

.purchase-history-total strong{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--green-bg);
  color:var(--green);
  font-size:11px;
}

.purchase-history-total span{
  color:#aaa;
  font-size:18px;
}

/* Arrival modal */
.purchase-product-preview{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:18px;
  padding:12px;
  border-radius:17px;
  background:#f7f7f5;
}

.purchase-product-image{
  width:60px;
  height:60px;
  flex:0 0 60px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:15px;
  background:#ecece8;
  font-size:24px;
}

.purchase-product-image img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.purchase-product-preview>div:last-child{
  min-width:0;
}

.purchase-product-preview small{
  display:block;
  margin-bottom:4px;
  font-size:7px;
  font-weight:800;
}

.purchase-product-preview h3{
  overflow:hidden;
  margin:0 0 4px;
  font-size:13px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.purchase-product-preview p{
  margin:0;
  color:#888;
  font-size:9px;
}

.purchase-method-options{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
}

.purchase-method-options button{
  min-height:40px;
  padding:9px 7px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#f7f7f5;
  color:#666;
  font-size:9px;
  font-weight:750;
}

.purchase-method-options button.active{
  border-color:#171717;
  background:#171717;
  color:#fff;
}

#arrivalPhotoPlaceholder{
  padding:22px;
  text-align:center;
}

#arrivalPhotoPlaceholder span{
  display:block;
  margin-bottom:7px;
  font-size:27px;
}

#arrivalPhotoPlaceholder strong{
  display:block;
  font-size:11px;
}

#arrivalPhotoPlaceholder small{
  display:block;
  margin-top:4px;
  font-size:8px;
}

/* General forms and sheets */
.sheet{
  overscroll-behavior:contain;
}

.sheet input,
.sheet select,
.sheet textarea{
  min-height:46px;
  font-size:16px; /* prevents iOS zoom */
}

.sheet textarea{
  min-height:88px;
}

.primary,
.secondary{
  min-height:48px;
  border-radius:15px;
}

.mini-action{
  min-height:36px;
}

/* Product cards */
.product-card{
  align-items:center;
  padding:11px;
}

.product-thumb,
.product-thumb-placeholder{
  width:72px;
  height:72px;
  flex-basis:72px;
}

/* Bottom nav */
.bottom-nav{
  height:calc(72px + env(safe-area-inset-bottom));
  padding:6px 8px max(6px,env(safe-area-inset-bottom));
  box-shadow:0 -8px 30px rgba(0,0,0,.035);
}

.bottom-nav button{
  min-width:0;
  font-size:8px;
}

/* Empty states */
.empty{
  padding:34px 18px;
  border:1px dashed #deded9;
  border-radius:20px;
  background:rgba(255,255,255,.55);
}

.empty>span{
  font-size:30px;
}

.empty h3{
  margin:11px 0 5px;
}

/* Mobile ergonomics */
@media(max-width:390px){
  .screen{
    padding-left:16px;
    padding-right:16px;
  }

  .trip-cover{
    margin-left:-16px;
    margin-right:-16px;
  }

  .purchase-summary-grid,
  .purchase-summary{
    gap:6px;
  }

  .purchase-summary-card,
  .purchase-summary>div{
    min-height:82px;
    padding:11px 8px;
  }

  .purchase-summary-card strong,
  .purchase-summary>div strong{
    font-size:16px;
  }

  .purchase-item-image{
    width:58px;
    height:58px;
    flex-basis:58px;
  }

  .purchase-item-stats{
    gap:5px;
  }

  .purchase-item-stats>div{
    padding:9px 6px;
  }

  .tabs button{
    font-size:9px;
  }
}

@media(max-width:340px){
  .purchase-summary-grid,
  .purchase-summary{
    grid-template-columns:1fr 1fr;
  }

  .purchase-summary-grid>div:last-child,
  .purchase-summary>div:last-child{
    grid-column:1/-1;
  }

  .purchase-item-footer{
    align-items:stretch;
    flex-direction:column;
  }

  .purchase-item-footer .mini-action{
    width:100%;
  }
}


/* =====================================================
   V5.0.1 TRIPS MOBILE CARDS
===================================================== */

#trips .page-header{
  margin-bottom:20px;
}

#tripList{
  display:flex;
  flex-direction:column;
  gap:11px;
}

.trip-card{
  width:100%;
  display:block;
  overflow:hidden;
  padding:0;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  box-shadow:var(--shadow-card);
  color:var(--text);
  text-align:left;
  appearance:none;
  -webkit-appearance:none;
}

.trip-card:active{
  transform:scale(.99);
}

.trip-card-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:17px 17px 14px;
}

.trip-card-top>div{
  min-width:0;
  flex:1;
}

.trip-card-top small{
  display:block;
  margin-bottom:6px;
  color:#92928d;
  font-size:8px;
  font-weight:800;
  letter-spacing:.55px;
  text-transform:uppercase;
}

.trip-card-top h3{
  margin:0 0 7px;
  color:#171717;
  font-size:17px;
  line-height:1.2;
  letter-spacing:-.25px;
}

.trip-card-top p{
  margin:0;
  color:#777;
  font-size:10px;
  line-height:1.4;
}

.trip-card-top .publish-badge{
  flex-shrink:0;
  margin:0;
}

.trip-card-meta{
  display:flex;
  align-items:center;
  gap:0;
  padding:12px 17px;
  border-top:1px solid #f0f0ed;
  background:#fafaf8;
}

.trip-card-meta span{
  position:relative;
  color:#777;
  font-size:9px;
  font-weight:650;
}

.trip-card-meta span+span{
  margin-left:20px;
}

.trip-card-meta span+span:before{
  content:"";
  position:absolute;
  left:-10px;
  top:50%;
  width:3px;
  height:3px;
  border-radius:50%;
  background:#bbb;
  transform:translateY(-50%);
}

@media(max-width:360px){
  .trip-card-top{
    padding:15px 14px 13px;
  }

  .trip-card-meta{
    padding:11px 14px;
  }

  .trip-card-top h3{
    font-size:16px;
  }
}


/* =====================================================
   V5.0.2 ORDERS MOBILE POLISH
===================================================== */

#orders .order-page-title{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
}

#orders .order-page-title small{
  display:block;
  margin-bottom:4px;
  color:#92928d;
  font-size:8px;
  font-weight:800;
  letter-spacing:.7px;
}

#orders .order-page-title h1{
  margin:0;
}

.payment-pending-counter{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:29px;
  padding:7px 11px;
  border-radius:999px;
  background:#f3f0ff;
  color:#5f5aa8;
  font-size:8px;
  font-weight:800;
}

.order-filter{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
  margin-bottom:18px;
}

.order-filter button{
  min-width:0;
  min-height:42px;
  padding:9px 5px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  color:#777;
  font-size:9px;
  font-weight:750;
  box-shadow:0 2px 12px rgba(0,0,0,.025);
}

.order-filter button.active{
  border-color:#171717;
  background:#171717;
  color:#fff;
}

#globalOrders{
  display:flex;
  flex-direction:column;
  gap:10px;
}

#globalOrders .order-card{
  width:100%;
  display:block;
  margin:0;
  padding:15px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow-card);
  color:var(--text);
  text-align:left;
  appearance:none;
  -webkit-appearance:none;
}

#globalOrders .order-card.payment-submitted{
  border-color:#d9d3f4;
  background:linear-gradient(180deg,#fff 0%,#fcfbff 100%);
}

#globalOrders .order-card:active{
  transform:scale(.99);
}

#globalOrders .order-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

#globalOrders .order-card-head>div{
  min-width:0;
  flex:1;
}

#globalOrders .order-card-head small{
  display:block;
  overflow:hidden;
  margin-bottom:5px;
  color:#9a9a95;
  font-size:7px;
  font-weight:700;
  letter-spacing:.25px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#globalOrders .order-card-head h3{
  overflow:hidden;
  margin:0;
  color:#171717;
  font-size:15px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#globalOrders .order-status{
  flex-shrink:0;
  margin:0;
  max-width:132px;
  padding:6px 9px;
  font-size:7px;
  line-height:1.15;
  text-align:center;
  white-space:normal;
}

#globalOrders .order-card-body{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:9px;
}

#globalOrders .order-card-body p{
  overflow:hidden;
  margin:0;
  color:#777;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#globalOrders .order-card-body span{
  position:relative;
  flex-shrink:0;
  color:#777;
  font-size:9px;
}

#globalOrders .order-card-body span:before{
  content:"";
  display:inline-block;
  width:3px;
  height:3px;
  margin:0 7px 2px 0;
  border-radius:50%;
  background:#bbb;
}

#globalOrders .order-payment-notice{
  margin:11px 0 0;
  padding:9px 10px;
  border-radius:11px;
  background:#f4f1ff;
  color:#59558c;
  font-size:8px;
  font-weight:750;
}

#globalOrders .order-card-footer{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:12px;
  padding-top:11px;
  border-top:1px solid #efefec;
}

#globalOrders .order-card-footer small{
  color:#9a9a95;
  font-size:7.5px;
  line-height:1.3;
}

#globalOrders .order-card-footer strong{
  flex-shrink:0;
  color:#171717;
  font-size:14px;
  line-height:1;
}

/* Order Detail mobile consistency */
#orderDetail .order-detail-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin:18px 0;
}

#orderDetail .order-detail-head>div{
  min-width:0;
}

#orderDetail .order-detail-head small{
  display:block;
  margin-bottom:4px;
  font-size:8px;
  font-weight:800;
}

#orderDetail .order-detail-head h1{
  overflow:hidden;
  max-width:220px;
  margin:0 0 5px;
  font-size:20px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#orderDetail .order-detail-head p{
  margin:0;
  color:#888;
  font-size:9px;
}

#orderDetail .order-detail-card{
  padding:16px;
  border-radius:20px;
}

#orderDetail .order-detail-item{
  gap:12px;
  padding:12px 0;
}

#orderDetail .order-detail-item>div{
  min-width:0;
  flex:1;
}

#orderDetail .order-detail-item strong{
  font-size:11px;
}

#orderDetail .order-detail-item small{
  display:block;
  margin-top:4px;
  font-size:8px;
}

@media(max-width:360px){
  #orders .order-filter{
    gap:5px;
  }

  #orders .order-filter button{
    min-height:40px;
    font-size:8px;
  }

  #globalOrders .order-card{
    padding:13px;
  }

  #globalOrders .order-card-head h3{
    font-size:14px;
  }
}


/* =====================================================
   V5.1 SHIPPING MOBILE UI
===================================================== */

#shipping{
  padding-top:18px;
}

.shipping-heading{
  margin-top:18px;
}

#shippingQueueList,
#shippingHistoryList{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.shipping-card,
.shipping-history-card{
  width:100%;
  display:block;
  padding:15px;
  border:1px solid var(--line);
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow-card);
  color:var(--text);
  text-align:left;
}

.shipping-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.shipping-card-head>div{
  min-width:0;
  flex:1;
}

.shipping-card-head small,
.shipping-history-card small{
  display:block;
  margin-bottom:5px;
  color:#999;
  font-size:7px;
  font-weight:750;
}

.shipping-card-head h3,
.shipping-history-card h3{
  margin:0 0 5px;
  font-size:14px;
}

.shipping-card-head p,
.shipping-history-card p{
  margin:0;
  color:#7f7f7a;
  font-size:9px;
}

.shipping-meta-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-top:12px;
}

.shipping-meta-grid>div{
  min-width:0;
  padding:10px;
  border-radius:12px;
  background:#f7f7f4;
}

.shipping-meta-grid small{
  display:block;
  margin-bottom:4px;
  color:#999;
  font-size:6.5px;
  font-weight:800;
}

.shipping-meta-grid strong{
  display:block;
  overflow:hidden;
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.shipping-card-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:13px;
  padding-top:12px;
  border-top:1px solid #efefec;
}

.shipping-card-footer>strong{
  font-size:13px;
}

.shipping-history-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  appearance:none;
  -webkit-appearance:none;
}

.shipping-history-card>div{
  min-width:0;
  flex:1;
}

.shipping-history-card>span{
  flex-shrink:0;
  color:#aaa;
  font-size:20px;
}

.shipping-order-preview{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:15px 0 18px;
  padding:13px;
  border-radius:16px;
  background:#f7f7f4;
}

.shipping-order-preview small{
  display:block;
  margin-bottom:4px;
  color:#999;
  font-size:7px;
  font-weight:800;
}

.shipping-order-preview strong{
  font-size:11px;
}

.shipping-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin-top:14px;
}

.shipping-detail-grid>div{
  min-width:0;
  padding:12px;
  border-radius:13px;
  background:#f7f7f4;
}

.shipping-detail-grid .full{
  grid-column:1/-1;
}

.shipping-detail-grid small{
  display:block;
  margin-bottom:5px;
  color:#999;
  font-size:7px;
  font-weight:800;
}

.shipping-detail-grid strong{
  display:block;
  overflow-wrap:anywhere;
  font-size:10px;
  line-height:1.45;
}

@media(max-width:360px){
  .shipping-card,
  .shipping-history-card{
    padding:13px;
  }

  .shipping-card-footer{
    align-items:stretch;
    flex-direction:column;
  }

  .shipping-card-footer .mini-action{
    width:100%;
  }
}


/* V5.1.1 Shipping AWB action */
.shipping-awb-cta{
  display:inline-flex;
  margin-top:8px;
  padding:6px 9px;
  border-radius:999px;
  background:#171717;
  color:#fff;
  font-size:7px;
  font-weight:800;
}

.shipping-detail-action{
  width:100%;
  margin-top:14px;
}


/* =====================================================
   V5.2 SHIPPING PAYMENT REVIEW
===================================================== */

.shipping-payment-notice{
  margin-top:11px;
  padding:10px 11px;
  border-radius:12px;
  font-size:8px;
  font-weight:750;
  line-height:1.4;
}

.shipping-payment-notice.waiting{
  background:#fff8e8;
  color:#85621a;
}

.shipping-payment-notice.submitted{
  background:#f2efff;
  color:#5e56a0;
}

.shipping-payment-notice.verified{
  background:#edf8ef;
  color:#347246;
}

.shipping-payment-notice.rejected{
  background:#fff0f0;
  color:#9b4444;
}

.shipping-payment-review{
  margin-top:14px;
}

.shipping-payment-amount{
  padding:15px;
  border-radius:16px;
  background:#f7f7f4;
}

.shipping-payment-amount small{
  display:block;
  margin-bottom:5px;
  color:#999;
  font-size:7px;
  font-weight:800;
}

.shipping-payment-amount strong{
  display:block;
  font-size:22px;
}

.shipping-payment-amount span{
  display:block;
  margin-top:5px;
  color:#888;
  font-size:8px;
}

.shipping-payment-review .seller-proof-image-button{
  width:100%;
  margin:12px 0 8px;
  padding:0;
  overflow:hidden;
  border:0;
  border-radius:16px;
  background:#f4f4f1;
}

.shipping-payment-review .seller-proof-image-button img{
  width:100%;
  max-height:330px;
  display:block;
  object-fit:contain;
}

#shippingAwbGroup{
  margin-top:0;
}


/* V4.11 WHATSAPP TRACKING */
.shipping-tracking-link{
  margin-top:10px;
  padding:12px 13px;
  border:1px solid #e4e4df;
  border-radius:14px;
  background:#f8f8f6;
  overflow:hidden;
}
.shipping-tracking-link small{
  display:block;
  margin-bottom:5px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.5px;
  color:#777;
}
.shipping-tracking-link strong{
  display:block;
  font-size:9px;
  line-height:1.45;
  overflow-wrap:anywhere;
}


/* =====================================================
   V4.12 STORE SETTINGS
===================================================== */

.store-settings-sheet{
  max-width:520px;
}

.store-settings-block{
  margin-bottom:16px;
  padding:15px;
  border:1px solid #e5e5df;
  border-radius:17px;
  background:#fafaf8;
}

.store-settings-block>small,
.enterprise-title small{
  display:block;
  margin-bottom:12px;
  color:#8b8b82;
  font-size:8px;
  font-weight:850;
  letter-spacing:.65px;
}

.store-settings-block label{
  display:block;
  margin:0 0 7px;
  font-size:10px;
  font-weight:750;
}

.store-settings-block p{
  margin:8px 0 0;
  color:#77776f;
  font-size:9px;
  line-height:1.5;
}

.store-slug-input{
  display:flex;
  align-items:center;
  overflow:hidden;
  border:1px solid #d9d9d2;
  border-radius:13px;
  background:#fff;
}

.store-slug-input span{
  padding-left:12px;
  color:#85857d;
  font-size:10px;
  white-space:nowrap;
}

.store-slug-input input{
  min-width:0;
  flex:1;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding-left:3px;
}

.store-url-preview{
  margin-top:12px;
  padding:11px 12px;
  border-radius:12px;
  background:#fff;
}

.store-url-preview small{
  display:block;
  margin-bottom:4px;
  color:#929289;
  font-size:7px;
  font-weight:800;
  letter-spacing:.5px;
}

.store-url-preview strong{
  display:block;
  overflow-wrap:anywhere;
  font-size:10px;
}

.enterprise-domain-block{
  background:#f7f7fb;
}

.enterprise-title{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.enterprise-title strong{
  display:block;
  font-size:13px;
}

.domain-status{
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:999px;
  background:#ecece8;
  color:#777;
  font-size:7px;
  font-weight:800;
}

.domain-status.pending{
  background:#fff1cb;
  color:#8a6b18;
}

.domain-status.verified{
  background:#e5f4e9;
  color:#347148;
}


/* =====================================================
   V6.10.1 ORDER ACTIVE / HISTORY SPLIT
===================================================== */

#orders .order-filter button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}

#orders .order-filter button span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#orders .order-filter button b{
  min-width:17px;
  height:17px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 4px;
  border-radius:999px;
  background:#f1f1ed;
  color:#777;
  font-size:7px;
  font-weight:850;
  line-height:1;
}

#orders .order-filter button.active b{
  background:rgba(255,255,255,.16);
  color:#fff;
}

#globalOrders .order-history-card{
  background:#fafaf8;
  border-color:#e4e4df;
  box-shadow:none;
}

#globalOrders .order-history-card .order-card-head h3{
  color:#555;
}

#globalOrders .order-history-card .order-card-body p,
#globalOrders .order-history-card .order-card-body span,
#globalOrders .order-history-card .order-card-footer small{
  color:#92928d;
}

@media(max-width:360px){
  #orders .order-filter button{
    gap:3px;
    padding-left:4px;
    padding-right:4px;
  }

  #orders .order-filter button b{
    min-width:15px;
    height:15px;
    padding:0 3px;
    font-size:6.5px;
  }
}




/* =====================================================
   V6.12.2 PRODUCT DETAIL / EDIT UI
===================================================== */

#productDetail{
  padding-bottom:34px;
}

.product-detail-v2{
  padding-bottom:18px;
}

.product-detail-media{
  position:relative;
  width:100%;
  aspect-ratio:1.16/1;
  overflow:hidden;
  border-radius:24px;
  background:#f1f1ed;
}

.product-detail-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.product-detail-empty-image{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  background:#f1f1ed;
}

.product-detail-empty-image span{
  font-size:48px;
  opacity:.45;
}

.product-detail-status{
  position:absolute;
  top:12px;
  right:12px;
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border:1px solid rgba(255,255,255,.7);
  border-radius:999px;
  background:rgba(255,255,255,.9);
  color:#555;
  box-shadow:0 4px 16px rgba(0,0,0,.08);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  font-size:8px;
  font-weight:850;
}

.product-detail-status.published{
  color:#19704d;
}

.product-detail-hero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:18px 2px 14px;
}

.product-detail-copy{
  min-width:0;
  flex:1;
}

.product-detail-category{
  display:block;
  margin-bottom:5px;
  color:#8a8a84;
  font-size:8px;
  font-weight:800;
  letter-spacing:.7px;
  text-transform:uppercase;
}

.product-detail-copy h1{
  margin:0;
  color:#171717;
  font-size:23px;
  font-weight:850;
  line-height:1.16;
  letter-spacing:-.45px;
}

.product-detail-price{
  display:block;
  margin-top:8px;
  color:#171717;
  font-size:18px;
  font-weight:850;
}

.product-edit-compact{
  flex:0 0 auto;
  min-width:64px;
  height:38px;
  padding:0 15px;
  border:1px solid #d8d8d2;
  border-radius:999px;
  background:#fff;
  color:#171717;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}

.product-edit-compact:active{
  transform:scale(.97);
  background:#f5f5f2;
}

.product-detail-inventory{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  margin-bottom:14px;
}

.product-detail-inventory>div{
  padding:13px 10px;
  border:1px solid #e6e6e0;
  border-radius:17px;
  background:#fff;
}

.product-detail-inventory small{
  display:block;
  margin-bottom:6px;
  color:#999991;
  font-size:7px;
  font-weight:850;
  letter-spacing:.45px;
}

.product-detail-inventory strong{
  color:#171717;
  font-size:16px;
  font-weight:850;
}

.product-detail-section-card{
  overflow:hidden;
  margin-top:4px;
  border:1px solid #e6e6e0;
  border-radius:20px;
  background:#fff;
}

.product-detail-section-head{
  padding:15px 15px 11px;
}

.product-detail-section-head small{
  display:block;
  margin-bottom:4px;
  color:#9a9a94;
  font-size:7px;
  font-weight:850;
  letter-spacing:.65px;
}

.product-detail-section-head h3{
  margin:0;
  color:#171717;
  font-size:13px;
  font-weight:850;
}

.product-detail-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:11px 15px;
  border-top:1px solid #f0f0ec;
}

.product-detail-row span{
  color:#777770;
  font-size:10px;
}

.product-detail-row strong{
  color:#171717;
  font-size:10px;
  font-weight:800;
  text-align:right;
}

.product-detail-row.highlight{
  background:#f7f7f4;
}

.product-detail-row.highlight span,
.product-detail-row.highlight strong{
  color:#171717;
  font-weight:850;
}

.product-publish-button{
  width:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:3px;
  margin-top:12px;
  padding:14px 16px;
  border:0;
  border-radius:18px;
  background:#171717;
  color:#fff;
  text-align:left;
  cursor:pointer;
}

.product-publish-button span{
  font-size:12px;
  font-weight:850;
}

.product-publish-button small{
  color:rgba(255,255,255,.58);
  font-size:8px;
  font-weight:650;
}

.product-publish-button.unpublish{
  border:1px solid #deded8;
  background:#fff;
  color:#171717;
}

.product-publish-button.unpublish small{
  color:#92928b;
}


/* Product add/edit sheet polish */

#productModal{
  align-items:flex-end;
}

#productModal .product-sheet{
  width:min(100%,520px);
  max-height:92vh;
  overflow-y:auto;
  padding:
    18px
    18px
    max(22px,env(safe-area-inset-bottom));
  border-radius:26px 26px 0 0;
  background:#fff;
}

#productModal .sheet-title{
  position:sticky;
  z-index:3;
  top:-18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 -18px 18px;
  padding:18px 18px 13px;
  border-bottom:1px solid #efefeb;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

#productModal .sheet-title h2{
  margin:0;
  font-size:17px;
  font-weight:850;
  letter-spacing:-.25px;
}

#productModal .sheet-title button{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:#f1f1ee;
  color:#555;
  font-size:19px;
}

#productModal label:not(.photo-upload){
  display:block;
  margin:
    15px
    0
    7px;
  color:#777770;
  font-size:9px;
  font-weight:800;
}

#productModal input,
#productModal select{
  min-height:44px;
  border:1px solid #deded8;
  border-radius:13px;
  background:#fafaf8;
  font-size:12px;
}

#productModal input:focus,
#productModal select:focus{
  border-color:#171717;
  background:#fff;
  outline:none;
}

#productModal .photo-upload{
  overflow:hidden;
  border:1px solid #e3e3dd;
  border-radius:18px;
  background:#f7f7f4;
}

#productModal .price-calculator{
  margin-top:13px;
  border-color:#e3e3dd;
  border-radius:17px;
  background:#fafaf8;
}

#productModal #productSaveButton{
  margin-top:20px;
  min-height:48px;
  border-radius:16px;
  font-size:12px;
}

#productModal .cancel{
  margin-top:4px;
  color:#999991;
  font-size:10px;
}

@media(max-width:360px){
  .product-detail-copy h1{
    font-size:20px;
  }

  .product-detail-price{
    font-size:16px;
  }

  .product-edit-compact{
    min-width:58px;
    height:36px;
    padding:0 13px;
  }
}


/* =====================================================
   V6.13 TRIP DETAIL MOBILE REWRITE
===================================================== */

#tripDetail.trip-detail-screen{
  padding:
    14px
    14px
    calc(104px + env(safe-area-inset-bottom));
  background:#f5f5f2;
}

#tripDetail .back-header{
  display:none;
}

.trip-detail-topbar{
  display:grid;
  grid-template-columns:40px 1fr 40px;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}

.trip-detail-topbar>div{
  min-width:0;
}

.trip-detail-topbar small{
  display:block;
  margin-bottom:1px;
  color:#9a9a94;
  font-size:7px;
  font-weight:850;
  letter-spacing:.7px;
}

.trip-detail-topbar strong{
  display:block;
  color:#171717;
  font-size:13px;
  font-weight:850;
}

.trip-detail-back,
.trip-detail-more{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #e4e4df;
  border-radius:14px;
  background:#fff;
  color:#171717;
  box-shadow:0 2px 10px rgba(0,0,0,.035);
}

.trip-detail-back{
  font-size:25px;
  line-height:1;
}

.trip-detail-more{
  font-size:13px;
  letter-spacing:1px;
}

.trip-detail-hero{
  display:flex;
  align-items:center;
  gap:14px;
  padding:17px;
  border-radius:23px;
  background:#171717;
  color:#fff;
}

.trip-detail-hero-icon{
  width:54px;
  height:54px;
  flex:0 0 54px;
  display:grid;
  place-items:center;
  border-radius:17px;
  background:#292929;
  font-size:27px;
}

.trip-detail-hero-copy{
  min-width:0;
  flex:1;
}

.trip-detail-mini-badge{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  margin-bottom:7px;
  padding:0 8px;
  border-radius:999px;
  background:#2c2c2c;
  color:#bdbdb7;
  font-size:7px;
  font-weight:850;
}

.trip-detail-mini-badge.published{
  background:#193d2f;
  color:#9be0bf;
}

.trip-detail-hero h1{
  overflow:hidden;
  margin:0;
  color:#fff;
  font-size:21px;
  font-weight:850;
  line-height:1.15;
  letter-spacing:-.4px;
  text-overflow:ellipsis;
}

.trip-detail-hero p{
  margin:6px 0 0;
  color:#aaa;
  font-size:9px;
}

.trip-detail-overview{
  margin-top:10px;
}

.trip-detail-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.trip-detail-summary>div{
  min-width:0;
  padding:11px 10px;
  border:1px solid #e5e5df;
  border-radius:16px;
  background:#fff;
}

.trip-detail-summary small{
  display:block;
  overflow:hidden;
  margin-bottom:4px;
  color:#999991;
  font-size:6.5px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-detail-summary strong{
  display:block;
  overflow:hidden;
  color:#171717;
  font-size:13px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-detail-summary .revenue strong{
  font-size:12px;
}

.trip-storefront-card{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:8px;
  padding:11px 12px;
  border:1px solid #e5e5df;
  border-radius:17px;
  background:#fff;
}

.trip-storefront-main{
  min-width:0;
  flex:1;
  display:flex;
  align-items:center;
  gap:10px;
}

.trip-storefront-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#f0f0ec;
  color:#555;
  font-size:14px;
  font-weight:850;
}

.trip-storefront-main>div:last-child{
  min-width:0;
}

.trip-storefront-main small{
  display:block;
  margin-bottom:2px;
  color:#999991;
  font-size:6.5px;
  font-weight:850;
  letter-spacing:.45px;
}

.trip-storefront-main h3{
  margin:0;
  color:#171717;
  font-size:11px;
  font-weight:850;
}

.trip-storefront-main p{
  overflow:hidden;
  margin:2px 0 0;
  color:#999;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-storefront-action{
  flex:0 0 auto;
  min-width:70px;
  height:34px;
  padding:0 12px;
  border:0;
  border-radius:12px;
  background:#171717;
  color:#fff;
  font-size:9px;
  font-weight:800;
}

.trip-detail-tabs.tabs{
  position:sticky;
  z-index:20;
  top:0;
  display:grid;
  grid-template-columns:repeat(4,minmax(72px,1fr));
  overflow-x:auto;
  gap:4px;
  margin:
    12px
    -14px
    13px;
  padding:
    7px
    14px;
  border-radius:0;
  background:rgba(245,245,242,.96);
  box-shadow:none;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  scrollbar-width:none;
}

.trip-detail-tabs.tabs::-webkit-scrollbar{
  display:none;
}

.trip-detail-tabs.tabs button{
  min-height:35px;
  padding:0 10px;
  border:1px solid #e3e3dd;
  border-radius:12px;
  background:#fff;
  color:#888881;
  font-size:8.5px;
  font-weight:800;
}

.trip-detail-tabs.tabs button.active{
  border-color:#171717;
  background:#171717;
  color:#fff;
}

.trip-tab-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:
    2px
    0
    10px;
}

.trip-tab-section-head small{
  display:block;
  margin-bottom:2px;
  color:#9a9a94;
  font-size:6.5px;
  font-weight:850;
  letter-spacing:.6px;
}

.trip-tab-section-head h2{
  margin:0;
  font-size:18px;
  font-weight:850;
  letter-spacing:-.3px;
}

.trip-add-inline{
  min-width:64px;
  height:34px;
  padding:0 12px;
  border:0;
  border-radius:12px;
  background:#171717;
  color:#fff;
  font-size:9px;
  font-weight:800;
}

.trip-product-row{
  width:100%;
  display:flex;
  align-items:center;
  gap:11px;
  margin-bottom:8px;
  padding:10px;
  border:1px solid #e4e4df;
  border-radius:17px;
  background:#fff;
  color:#171717;
  text-align:left;
  box-shadow:0 2px 10px rgba(0,0,0,.025);
}

.trip-product-thumb{
  width:58px;
  height:58px;
  flex:0 0 58px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:14px;
  background:#f0f0ec;
}

.trip-product-thumb img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.trip-product-thumb span{
  font-size:22px;
}

.trip-product-body{
  min-width:0;
  flex:1;
}

.trip-product-topline{
  display:flex;
  align-items:flex-start;
  gap:8px;
}

.trip-product-title-wrap{
  min-width:0;
  flex:1;
}

.trip-product-title-wrap h3{
  overflow:hidden;
  margin:0 0 3px;
  color:#171717;
  font-size:12px;
  font-weight:850;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-product-title-wrap>span{
  display:block;
  overflow:hidden;
  color:#999991;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-product-publish{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:21px;
  padding:0 7px;
  border-radius:999px;
  background:#f1f1ed;
  color:#777;
  font-size:6.5px;
  font-weight:850;
}

.trip-product-publish.published{
  background:#eaf7f0;
  color:#287454;
}

.trip-product-bottomline{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:8px;
  margin-top:9px;
}

.trip-product-bottomline strong{
  color:#171717;
  font-size:12px;
  font-weight:850;
}

.trip-product-bottomline span{
  color:#9a9a94;
  font-size:7.5px;
  white-space:nowrap;
}

.trip-product-chevron{
  flex:0 0 auto;
  color:#bbb;
  font-size:19px;
  line-height:1;
}

.trip-product-empty{
  padding:24px 18px;
  border:1px dashed #dcdcd6;
  border-radius:18px;
  background:#fff;
  text-align:center;
}

.trip-product-empty-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin:0 auto 10px;
  border-radius:15px;
  background:#f1f1ed;
  font-size:21px;
}

.trip-product-empty h3{
  margin:0 0 5px;
  font-size:13px;
}

.trip-product-empty p{
  margin:0 auto 13px;
  max-width:230px;
  color:#999;
  font-size:9px;
  line-height:1.45;
}

.trip-product-empty button{
  min-height:35px;
  padding:0 13px;
  border:0;
  border-radius:12px;
  background:#171717;
  color:#fff;
  font-size:9px;
  font-weight:800;
}

#tripDetail .purchase-heading{
  margin-top:4px;
}

#tripDetail .purchase-summary-grid{
  gap:7px;
}

#tripDetail .purchase-summary-card{
  min-height:76px;
  padding:10px 9px;
  border-radius:15px;
}

#tripDetail .purchase-section-head{
  margin-top:18px;
}

#tripDetail .purchase-item-card,
#tripDetail .purchase-history-card,
#tripDetail .order-card{
  box-shadow:0 2px 10px rgba(0,0,0,.025);
}

@media(max-width:360px){
  #tripDetail.trip-detail-screen{
    padding-left:12px;
    padding-right:12px;
  }

  .trip-detail-tabs.tabs{
    margin-left:-12px;
    margin-right:-12px;
    padding-left:12px;
    padding-right:12px;
  }

  .trip-detail-summary strong{
    font-size:12px;
  }

  .trip-detail-hero h1{
    font-size:19px;
  }

  .trip-product-thumb{
    width:54px;
    height:54px;
    flex-basis:54px;
  }
}


/* =====================================================
   V6.13.1 TRIP ORDER / PURCHASE / ARRIVAL MOBILE POLISH
===================================================== */

.trip-section-count{
  min-width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#ecece8;
  color:#555;
  font-size:9px;
  font-weight:850;
}

.trip-compact-empty{
  padding:24px 18px;
  border:1px dashed #dcdcd6;
  border-radius:18px;
  background:#fff;
  text-align:center;
}

.trip-compact-empty>div{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  margin:0 auto 10px;
  border-radius:14px;
  background:#f1f1ed;
  font-size:20px;
}

.trip-compact-empty h3{
  margin:0 0 5px;
  font-size:13px;
}

.trip-compact-empty p{
  max-width:240px;
  margin:0 auto;
  color:#999;
  font-size:9px;
  line-height:1.45;
}

/* Orders inside Trip */
#tripOrderList .trip-order-stack{
  display:flex;
  flex-direction:column;
  gap:8px;
}

#tripOrderList .order-card{
  width:100%;
  display:block;
  margin:0;
  padding:12px;
  border:1px solid #e4e4df;
  border-radius:17px;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.025);
  color:#171717;
  text-align:left;
}

#tripOrderList .order-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

#tripOrderList .order-card-head>div{
  min-width:0;
  flex:1;
}

#tripOrderList .order-card-head small{
  display:block;
  overflow:hidden;
  margin-bottom:4px;
  color:#9a9a94;
  font-size:6.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#tripOrderList .order-card-head h3{
  overflow:hidden;
  margin:0;
  font-size:12px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#tripOrderList .order-status{
  flex:0 0 auto;
  padding:5px 8px;
  font-size:6.5px;
}

#tripOrderList .order-card-body{
  display:flex;
  align-items:center;
  gap:7px;
  margin-top:8px;
}

#tripOrderList .order-card-body p,
#tripOrderList .order-card-body span{
  margin:0;
  color:#8f8f88;
  font-size:8px;
}

#tripOrderList .order-card-body span:before{
  content:"•";
  margin-right:7px;
  color:#bbb;
}

#tripOrderList .order-card-footer{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid #f0f0ec;
}

#tripOrderList .order-card-footer small{
  color:#9a9a94;
  font-size:7px;
}

#tripOrderList .order-card-footer strong{
  color:#171717;
  font-size:12px;
  font-weight:850;
}

#tripOrderList .order-payment-notice{
  margin-top:9px;
  padding:7px 9px;
  border-radius:10px;
  font-size:7.5px;
}

/* Purchase / Arrival shared */
#tripPurchase .purchase-heading,
#tripArrival .purchase-heading{
  margin:2px 0 12px;
}

#tripPurchase .purchase-heading small,
#tripArrival .purchase-heading small{
  margin-bottom:3px;
  color:#9a9a94;
  font-size:6.5px;
}

#tripPurchase .purchase-heading h2,
#tripArrival .purchase-heading h2{
  margin-bottom:4px;
  font-size:18px;
}

#tripPurchase .purchase-heading p,
#tripArrival .purchase-heading p{
  max-width:300px;
  font-size:9px;
  line-height:1.45;
}

#tripPurchase .purchase-summary-grid,
#tripArrival .purchase-summary-grid{
  margin:11px 0 16px;
}

#tripPurchase .purchase-summary-card,
#tripArrival .purchase-summary-card{
  min-height:68px;
  padding:9px 8px;
  border-radius:14px;
  box-shadow:0 2px 8px rgba(0,0,0,.02);
}

#tripPurchase .purchase-summary-card small,
#tripArrival .purchase-summary-card small{
  margin-bottom:4px;
  font-size:6px;
}

#tripPurchase .purchase-summary-card strong,
#tripArrival .purchase-summary-card strong{
  font-size:14px;
}

#tripPurchase .purchase-summary-card span,
#tripArrival .purchase-summary-card span{
  font-size:7px;
}

#tripPurchase .purchase-section-head,
#tripArrival .purchase-section-head{
  align-items:center;
  margin:17px 0 9px;
}

#tripPurchase .purchase-section-head h3,
#tripArrival .purchase-section-head h3{
  font-size:14px;
}

#tripPurchase .purchase-count-badge,
#tripArrival .purchase-count-badge{
  min-height:24px;
  padding:5px 8px;
  font-size:7px;
}

#tripPurchase .purchase-item-card,
#tripArrival .purchase-item-card{
  margin-bottom:8px;
  padding:11px;
  border-radius:17px;
  box-shadow:0 2px 10px rgba(0,0,0,.025);
}

#tripPurchase .purchase-item-main,
#tripArrival .purchase-item-main{
  gap:10px;
}

#tripPurchase .purchase-item-image,
#tripArrival .purchase-item-image{
  width:54px;
  height:54px;
  flex-basis:54px;
  border-radius:13px;
}

#tripPurchase .purchase-item-copy h3,
#tripArrival .purchase-item-copy h3{
  margin-bottom:3px;
  font-size:11.5px;
}

#tripPurchase .purchase-item-copy small,
#tripArrival .purchase-item-copy small{
  margin-bottom:3px;
  font-size:6px;
}

#tripPurchase .purchase-item-copy p,
#tripArrival .purchase-item-copy p{
  font-size:7.5px;
}

#tripPurchase .purchase-item-stats,
#tripArrival .purchase-item-stats{
  gap:5px;
  margin-top:10px;
}

#tripPurchase .purchase-item-stats>div,
#tripArrival .purchase-item-stats>div{
  padding:8px 7px;
  border-radius:11px;
}

#tripPurchase .purchase-item-stats small,
#tripArrival .purchase-item-stats small{
  margin-bottom:3px;
  font-size:5.8px;
}

#tripPurchase .purchase-item-stats strong,
#tripArrival .purchase-item-stats strong{
  font-size:12px;
}

#tripPurchase .purchase-item-footer,
#tripArrival .purchase-item-footer{
  margin-top:10px;
  padding-top:10px;
}

#tripPurchase .purchase-item-footer small,
#tripArrival .purchase-item-footer small{
  font-size:6px;
}

#tripPurchase .purchase-item-footer strong,
#tripArrival .purchase-item-footer strong{
  font-size:10.5px;
}

.trip-primary-small{
  flex:0 0 auto;
  min-height:34px;
  padding:0 11px;
  border:0;
  border-radius:11px;
  background:#171717;
  color:#fff;
  font-size:8px;
  font-weight:800;
}

.trip-inline-notice{
  margin-top:9px;
  padding:8px 9px;
  border-radius:10px;
  background:#f1f1ed;
  color:#777;
  font-size:7.5px;
  line-height:1.4;
}

.trip-inline-notice.warning{
  background:#fff5e8;
  color:#9b6723;
}

.arrival-waiting-pill{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:23px;
  padding:0 7px;
  border-radius:999px;
  background:#fff1df;
  color:#98651f;
  font-size:6.5px;
  font-weight:850;
}

.arrival-allocation-details{
  margin-top:10px;
  border-top:1px solid #efefec;
}

.arrival-allocation-details summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 1px 2px;
  color:#555;
  cursor:pointer;
  list-style:none;
}

.arrival-allocation-details summary::-webkit-details-marker{
  display:none;
}

.arrival-allocation-details summary span{
  font-size:7px;
  font-weight:850;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.arrival-allocation-details summary small{
  color:#999;
  font-size:7px;
}

.arrival-allocation-list{
  padding-top:5px;
}

.arrival-allocation-row{
  padding:9px 0;
  border-top:1px solid #f0f0ec;
}

.arrival-allocation-row:first-child{
  border-top:0;
}

.arrival-allocation-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.arrival-allocation-head>div{
  min-width:0;
}

.arrival-allocation-head strong{
  display:block;
  overflow:hidden;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.arrival-allocation-head small{
  display:block;
  margin-top:2px;
  color:#9a9a94;
  font-size:6px;
}

.arrival-allocation-status{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:21px;
  padding:0 7px;
  border-radius:999px;
  background:#fff1df;
  color:#98651f;
  font-size:6px;
  font-weight:850;
}

.arrival-allocation-status.complete{
  background:#eaf7f0;
  color:#287454;
}

.arrival-allocation-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:5px;
  margin-top:7px;
}

.arrival-allocation-stats>div{
  padding:7px 6px;
  border-radius:9px;
  background:#f7f7f4;
}

.arrival-allocation-stats small{
  display:block;
  margin-bottom:2px;
  color:#999;
  font-size:5.5px;
}

.arrival-allocation-stats strong{
  display:block;
  font-size:10px;
}

/* History rows in Purchase / Arrival */
#tripPurchase .purchase-history-card,
#tripArrival .purchase-history-card{
  min-height:64px;
  margin-bottom:7px;
  padding:11px 12px;
  border-radius:16px;
}

#tripPurchase .purchase-history-card small,
#tripArrival .purchase-history-card small{
  margin-bottom:3px;
  font-size:6px;
}

#tripPurchase .purchase-history-card h3,
#tripArrival .purchase-history-card h3{
  margin-bottom:3px;
  font-size:10.5px;
}

#tripPurchase .purchase-history-card p,
#tripArrival .purchase-history-card p{
  font-size:7.5px;
}

#tripPurchase .purchase-history-total strong,
#tripArrival .purchase-history-total strong{
  width:auto;
  height:auto;
  min-width:30px;
  padding:0;
  border-radius:0;
  background:transparent;
  color:#171717;
  font-size:10px;
}

#tripArrival .purchase-history-total strong{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#eaf7f0;
  color:#287454;
}

#tripPurchase .purchase-history-total span,
#tripArrival .purchase-history-total span{
  font-size:16px;
}

@media(max-width:360px){
  .arrival-waiting-pill{
    display:none;
  }

  #tripPurchase .purchase-item-image,
  #tripArrival .purchase-item-image{
    width:50px;
    height:50px;
    flex-basis:50px;
  }

  .trip-primary-small{
    padding:0 9px;
    font-size:7.5px;
  }
}


/* =====================================================
   V6.14 HOME MOBILE REWRITE
===================================================== */

#home.home-screen{
  padding:
    16px
    14px
    calc(104px + env(safe-area-inset-bottom));
  background:#f5f5f2;
}

.home-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}

.home-title-block{
  min-width:0;
  flex:1;
}

.home-title-block>small{
  display:block;
  margin-bottom:4px;
  color:#9a9a94;
  font-size:6.5px;
  font-weight:850;
  letter-spacing:.75px;
}

.home-title-block h1{
  overflow:hidden;
  margin:0;
  color:#171717;
  font-size:22px;
  font-weight:850;
  line-height:1.15;
  letter-spacing:-.4px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-title-block p{
  margin:4px 0 0;
  color:#8e8e88;
  font-size:8.5px;
}

.home-avatar{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #e3e3dd;
  border-radius:14px;
  background:#fff;
  color:#171717;
  box-shadow:0 2px 10px rgba(0,0,0,.035);
  font-size:13px;
  font-weight:850;
}

.home-trip-card{
  overflow:hidden;
  border-radius:22px;
  background:#171717;
  color:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.09);
}

.home-trip-card-head{
  display:flex;
  align-items:center;
  gap:13px;
  padding:16px;
}

.home-trip-icon{
  width:48px;
  height:48px;
  flex:0 0 48px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:#2a2a2a;
  font-size:23px;
}

.home-trip-copy{
  min-width:0;
  flex:1;
}

.home-trip-copy>span{
  display:block;
  margin-bottom:4px;
  color:#8d8d89;
  font-size:6.5px;
  font-weight:850;
  letter-spacing:.65px;
}

.home-trip-copy h2{
  overflow:hidden;
  margin:0;
  color:#fff;
  font-size:17px;
  font-weight:850;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-trip-copy p{
  overflow:hidden;
  margin:5px 0 0;
  color:#999;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-trip-card-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:
    10px
    12px
    10px
    16px;
  border-top:1px solid #2c2c2c;
  background:#1e1e1e;
}

.home-trip-card-foot>div{
  display:flex;
  align-items:center;
  gap:7px;
}

.home-trip-card-foot small{
  color:#777;
  font-size:6.5px;
  font-weight:850;
}

.home-trip-card-foot strong{
  color:#fff;
  font-size:12px;
  font-weight:850;
}

.home-trip-card-foot button{
  min-height:34px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 11px;
  border:0;
  border-radius:11px;
  background:#fff;
  color:#171717;
  font-size:8.5px;
  font-weight:850;
}

.home-trip-card-foot button span{
  font-size:16px;
  line-height:1;
}

.home-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin:
    18px
    1px
    9px;
}

.home-section-head.quick{
  margin-top:20px;
}

.home-section-head small{
  display:block;
  margin-bottom:3px;
  color:#9a9a94;
  font-size:6.5px;
  font-weight:850;
  letter-spacing:.65px;
}

.home-section-head h2{
  margin:0;
  color:#171717;
  font-size:15px;
  font-weight:850;
  letter-spacing:-.2px;
}

.home-kpi-grid{
  display:grid;
  grid-template-columns:1.35fr .8fr .8fr;
  gap:7px;
}

.home-kpi-card{
  min-width:0;
  min-height:66px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:10px;
  border:1px solid #e4e4df;
  border-radius:15px;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.02);
}

.home-kpi-card span{
  display:block;
  margin-bottom:5px;
  color:#999991;
  font-size:6.5px;
  font-weight:800;
}

.home-kpi-card strong{
  display:block;
  overflow:hidden;
  color:#171717;
  font-size:13px;
  font-weight:850;
  line-height:1.15;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-kpi-card:first-child strong{
  font-size:14px;
}

.home-attention-card{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:10px;
  padding:11px;
  border:1px solid #e6dff8;
  border-radius:16px;
  background:#f7f4ff;
  cursor:pointer;
}

.home-attention-icon{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#fff;
  font-size:17px;
}

.home-attention-copy{
  min-width:0;
  flex:1;
}

.home-attention-copy small{
  display:block;
  margin-bottom:2px;
  color:#766ba2;
  font-size:6px;
  font-weight:850;
  letter-spacing:.5px;
}

.home-attention-copy strong{
  display:block;
  overflow:hidden;
  color:#342e4a;
  font-size:9.5px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-attention-copy p{
  overflow:hidden;
  margin:2px 0 0;
  color:#887ea4;
  font-size:7.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-attention-card>span{
  flex:0 0 auto;
  color:#8c83a7;
  font-size:18px;
}

.home-action-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}

.home-action-grid>button{
  min-width:0;
  min-height:72px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px;
  border:1px solid #e3e3dd;
  border-radius:16px;
  background:#fff;
  color:#171717;
  text-align:left;
  box-shadow:0 2px 8px rgba(0,0,0,.02);
}

.home-action-icon{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#f0f0ec;
  font-size:17px;
}

.home-action-copy{
  min-width:0;
  flex:1;
}

.home-action-copy strong{
  display:block;
  overflow:hidden;
  margin-bottom:3px;
  color:#171717;
  font-size:9.5px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-action-copy small{
  display:block;
  overflow:hidden;
  color:#999991;
  font-size:7px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.home-all-trips{
  width:100%;
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:9px;
  padding:10px 12px;
  border:1px solid #e3e3dd;
  border-radius:16px;
  background:#fff;
  color:#171717;
  text-align:left;
}

.home-all-trips>span:first-child{
  min-width:0;
  flex:1;
}

.home-all-trips small{
  display:block;
  margin-bottom:2px;
  color:#999991;
  font-size:6px;
  font-weight:850;
  letter-spacing:.5px;
}

.home-all-trips strong{
  display:block;
  font-size:9.5px;
  font-weight:850;
}

.home-all-trips>span:last-child{
  color:#aaa;
  font-size:18px;
}

@media(max-width:360px){
  #home.home-screen{
    padding-left:12px;
    padding-right:12px;
  }

  .home-kpi-grid{
    grid-template-columns:1.2fr .8fr .8fr;
    gap:5px;
  }

  .home-kpi-card{
    padding:9px 8px;
  }

  .home-action-grid{
    gap:6px;
  }

  .home-action-grid>button{
    min-height:68px;
    gap:8px;
    padding:9px;
  }

  .home-action-icon{
    width:34px;
    height:34px;
    flex-basis:34px;
  }
}


/* =====================================================
   V6.15.1 HOME ADD PRODUCT TRIP PICKER
===================================================== */

.product-trip-picker-sheet{
  padding-bottom:
    max(
      20px,
      env(safe-area-inset-bottom)
    );
}

.product-trip-picker-copy{
  margin:
    -4px
    0
    13px;
  color:#8e8e88;
  font-size:9px;
  line-height:1.45;
}

.product-trip-picker-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.product-trip-option{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px;
  border:1px solid #e3e3dd;
  border-radius:15px;
  background:#fff;
  color:#171717;
  text-align:left;
}

.product-trip-option-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#f0f0ec;
  font-size:17px;
}

.product-trip-option-copy{
  min-width:0;
  flex:1;
}

.product-trip-option-copy strong{
  display:block;
  overflow:hidden;
  margin-bottom:3px;
  font-size:10px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.product-trip-option-copy small{
  display:block;
  overflow:hidden;
  color:#999991;
  font-size:7px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.product-trip-option-status{
  flex:0 0 auto;
  padding:5px 7px;
  border-radius:999px;
  background:#f1f1ed;
  color:#777;
  font-size:6px;
  font-weight:800;
}

.product-trip-option-arrow{
  flex:0 0 auto;
  color:#aaa;
  font-size:18px;
}

.product-trip-picker-new{
  width:100%;
  min-height:42px;
  margin-top:10px;
  border:1px dashed #d5d5cf;
  border-radius:13px;
  background:#fafaf8;
  color:#555;
  font-size:8.5px;
  font-weight:800;
}


/* =====================================================
   V6.16 MOBILE APP TRIPS / ORDERS + STICKY HEADERS
===================================================== */

:root{
  --app-header-bg:rgba(245,245,242,.96);
}

/* Sticky top headers across app screens */
#home .home-topbar,
#tripDetail .trip-detail-topbar,
.screen > .page-header:first-child,
.screen > .back-header:first-child,
.mobile-page-header{
  position:sticky;
  z-index:50;
  top:0;
  background:var(--app-header-bg);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

#home .home-topbar{
  margin:
    -16px
    -14px
    14px;
  padding:
    14px
    14px
    10px;
  border-bottom:1px solid rgba(222,222,216,.55);
}

#tripDetail .trip-detail-topbar{
  margin:
    -14px
    -14px
    12px;
  padding:
    12px
    14px
    10px;
  border-bottom:1px solid rgba(222,222,216,.55);
}

.screen > .back-header:first-child{
  margin:
    -22px
    -20px
    16px;
  padding:
    14px
    20px
    10px;
  border-bottom:1px solid rgba(222,222,216,.7);
}

.mobile-page-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:
    -16px
    -14px
    14px;
  padding:
    14px
    14px
    11px;
  border-bottom:1px solid rgba(222,222,216,.6);
}

.mobile-page-header>div{
  min-width:0;
  flex:1;
}

.mobile-page-header small{
  display:block;
  margin-bottom:3px;
  color:#9a9a94;
  font-size:6.5px;
  font-weight:850;
  letter-spacing:.7px;
}

.mobile-page-header h1{
  margin:0;
  color:#171717;
  font-size:21px;
  font-weight:850;
  line-height:1.1;
  letter-spacing:-.4px;
}

.mobile-page-header p{
  overflow:hidden;
  margin:4px 0 0;
  color:#92928d;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mobile-header-action{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:13px;
  background:#171717;
  color:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.12);
  font-size:23px;
  font-weight:500;
}

/* Trips screen */
#trips.trips-screen,
#orders.orders-screen{
  padding:
    16px
    14px
    calc(104px + env(safe-area-inset-bottom));
  background:#f5f5f2;
}

.trip-status-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:6px;
  margin-bottom:12px;
}

.trip-status-summary>div{
  min-width:0;
  padding:9px 10px;
  border:1px solid #e3e3dd;
  border-radius:14px;
  background:#fff;
}

.trip-status-summary small{
  display:block;
  margin-bottom:4px;
  color:#9a9a94;
  font-size:5.8px;
  font-weight:850;
  letter-spacing:.35px;
}

.trip-status-summary strong{
  color:#171717;
  font-size:14px;
  font-weight:850;
}

#tripList{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.trip-mobile-card{
  width:100%;
  display:flex;
  align-items:stretch;
  gap:0;
  overflow:hidden;
  padding:0;
  border:1px solid #e3e3dd;
  border-radius:18px;
  background:#fff;
  color:#171717;
  box-shadow:0 2px 10px rgba(0,0,0,.025);
  text-align:left;
}

.trip-mobile-card:active{
  transform:scale(.995);
}

.trip-mobile-accent{
  width:48px;
  flex:0 0 48px;
  display:grid;
  place-items:start center;
  padding-top:15px;
  background:#f0f0ec;
  font-size:20px;
}

.trip-mobile-card.ongoing .trip-mobile-accent{
  background:#eaf7f0;
}

.trip-mobile-card.completed .trip-mobile-accent{
  background:#eeeeeb;
}

.trip-mobile-content{
  min-width:0;
  flex:1;
  padding:12px 12px 10px;
}

.trip-mobile-title-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
}

.trip-mobile-title-row>div{
  min-width:0;
  flex:1;
}

.trip-mobile-status{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  margin-bottom:5px;
  padding:0 7px;
  border-radius:999px;
  background:#f1f1ed;
  color:#777;
  font-size:6px;
  font-weight:850;
}

.trip-mobile-status.ongoing{
  background:#eaf7f0;
  color:#287454;
}

.trip-mobile-status.completed{
  background:#ededeb;
  color:#777;
}

.trip-mobile-title-row h3{
  overflow:hidden;
  margin:0 0 4px;
  color:#171717;
  font-size:13px;
  font-weight:850;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-mobile-title-row p{
  margin:0;
  color:#93938d;
  font-size:7.5px;
}

.trip-mobile-chevron{
  flex:0 0 auto;
  color:#aaa;
  font-size:19px;
  line-height:1;
}

.trip-mobile-meta{
  display:flex;
  align-items:center;
  gap:13px;
  margin-top:10px;
  padding-top:9px;
  border-top:1px solid #f0f0ec;
}

.trip-mobile-meta span{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
  color:#999991;
  font-size:6px;
}

.trip-mobile-meta b{
  overflow:hidden;
  color:#171717;
  font-size:9px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-mobile-publish{
  margin-top:8px;
}

.trip-mobile-publish span{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:0 7px;
  border-radius:999px;
  font-size:6px;
  font-weight:850;
}

.trip-mobile-publish .published{
  background:#eaf7f0;
  color:#287454;
}

.trip-mobile-publish .draft{
  background:#f1f1ed;
  color:#777;
}

.trip-mobile-empty{
  padding:28px 18px;
  border:1px dashed #d9d9d4;
  border-radius:18px;
  background:#fff;
  text-align:center;
}

.trip-mobile-empty>div{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin:0 auto 10px;
  border-radius:15px;
  background:#f1f1ed;
  font-size:21px;
}

.trip-mobile-empty h3{
  margin:0 0 5px;
  font-size:13px;
}

.trip-mobile-empty p{
  max-width:240px;
  margin:0 auto 13px;
  color:#999;
  font-size:8.5px;
  line-height:1.45;
}

.trip-mobile-empty button{
  min-height:36px;
  padding:0 13px;
  border:0;
  border-radius:11px;
  background:#171717;
  color:#fff;
  font-size:8.5px;
  font-weight:800;
}

/* Orders */
.orders-page-header{
  margin-bottom:0;
}

.orders-filter-sticky{
  position:sticky;
  z-index:45;
  top:73px;
  margin:
    0
    -14px
    11px;
  padding:
    8px
    14px;
  border-bottom:1px solid rgba(222,222,216,.6);
  background:var(--app-header-bg);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

#orders .order-filter{
  display:grid;
  grid-template-columns:repeat(4,minmax(68px,1fr));
  gap:5px;
  overflow-x:auto;
  margin:0;
  scrollbar-width:none;
}

#orders .order-filter::-webkit-scrollbar{
  display:none;
}

#orders .order-filter button{
  min-height:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:0 7px;
  border:1px solid #e3e3dd;
  border-radius:12px;
  background:#fff;
  box-shadow:none;
  color:#777;
  font-size:7.5px;
  font-weight:800;
}

#orders .order-filter button b{
  min-width:18px;
  height:18px;
  display:grid;
  place-items:center;
  padding:0 4px;
  border-radius:999px;
  background:#f0f0ec;
  color:#777;
  font-size:6px;
  font-weight:850;
}

#orders .order-filter button.active{
  border-color:#171717;
  background:#171717;
  color:#fff;
}

#orders .order-filter button.active b{
  background:#fff;
  color:#171717;
}

#globalOrders{
  display:flex;
  flex-direction:column;
  gap:8px;
}

#globalOrders .order-card{
  margin:0;
  padding:11px;
  border:1px solid #e3e3dd;
  border-radius:17px;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.025);
}

#globalOrders .order-card-head{
  align-items:center;
}

.order-card-customer{
  min-width:0;
  flex:1;
  display:flex;
  align-items:center;
  gap:9px;
}

.order-customer-avatar{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#f0f0ec;
  color:#555;
  font-size:11px;
  font-weight:850;
}

.order-card-customer>div{
  min-width:0;
  flex:1;
}

.order-card-status-wrap{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
}

.order-card-chevron{
  color:#aaa;
  font-size:18px;
  line-height:1;
}

#globalOrders .order-card-head small{
  margin-bottom:3px;
  font-size:6px;
}

#globalOrders .order-card-head h3{
  font-size:11px;
}

#globalOrders .order-card-body{
  margin:
    9px
    0
    0
    45px;
}

#globalOrders .order-card-footer{
  margin:
    9px
    0
    0
    45px;
  padding-top:9px;
}

#globalOrders .order-card-footer small{
  font-size:6.5px;
}

#globalOrders .order-card-footer strong{
  font-size:11px;
}

#globalOrders .order-payment-notice{
  margin:
    8px
    0
    0
    45px;
  padding:7px 9px;
  border-radius:10px;
  font-size:7px;
}

#orders .payment-pending-counter{
  min-height:28px;
  padding:0 9px;
  border-radius:999px;
  font-size:6.5px;
}

/* Sticky heading for remaining top-level menus */
#business > .page-header:first-child,
#shipping > .back-header:first-child,
#productDetail > .back-header:first-child,
#orderDetail > .back-header:first-child{
  top:0;
}

/* Prevent content being hidden by sticky headers */
.screen{
  scroll-margin-top:72px;
}

@media(max-width:360px){
  #trips.trips-screen,
  #orders.orders-screen{
    padding-left:12px;
    padding-right:12px;
  }

  .mobile-page-header{
    margin-left:-12px;
    margin-right:-12px;
    padding-left:12px;
    padding-right:12px;
  }

  .orders-filter-sticky{
    margin-left:-12px;
    margin-right:-12px;
    padding-left:12px;
    padding-right:12px;
  }

  .trip-mobile-accent{
    width:44px;
    flex-basis:44px;
  }

  .trip-mobile-content{
    padding-left:10px;
    padding-right:10px;
  }
}


/* =====================================================
   V6.17 TRIP SETTINGS
===================================================== */

.trip-settings-sheet{
  padding-bottom:
    max(
      22px,
      env(safe-area-inset-bottom)
    );
}

.trip-settings-current{
  display:flex;
  align-items:center;
  gap:11px;
  margin-bottom:16px;
  padding:11px;
  border:1px solid #e4e4df;
  border-radius:16px;
  background:#fafaf8;
}

.trip-settings-icon{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#efefeb;
  font-size:19px;
}

.trip-settings-current>div{
  min-width:0;
  flex:1;
}

.trip-settings-current small{
  display:block;
  margin-bottom:2px;
  color:#9a9a94;
  font-size:6px;
  font-weight:850;
  letter-spacing:.5px;
}

.trip-settings-current strong{
  display:block;
  overflow:hidden;
  color:#171717;
  font-size:11px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-settings-current p{
  margin:2px 0 0;
  color:#8e8e88;
  font-size:7.5px;
}

.trip-settings-storefront{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:17px;
  padding:12px;
  border:1px solid #e4e4df;
  border-radius:16px;
  background:#fff;
}

.trip-settings-storefront>div{
  min-width:0;
  flex:1;
}

.trip-settings-storefront small{
  display:block;
  margin-bottom:3px;
  color:#999991;
  font-size:6px;
  font-weight:850;
  letter-spacing:.5px;
}

.trip-settings-storefront strong{
  display:block;
  margin-bottom:2px;
  color:#171717;
  font-size:10px;
  font-weight:850;
}

.trip-settings-storefront p{
  overflow:hidden;
  margin:0;
  color:#999;
  font-size:7.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#tripSettingsPublishToggle{
  flex:0 0 auto;
  min-width:74px;
  height:34px;
  padding:0 11px;
  border:0;
  border-radius:11px;
  background:#171717;
  color:#fff;
  font-size:8px;
  font-weight:800;
}

#tripSettingsPublishToggle.published{
  border:1px solid #deded8;
  background:#fff;
  color:#555;
}

#tripSettingsSaveButton{
  margin-top:16px;
}

#tripSettingsSaveButton:disabled{
  opacity:.65;
}


/* =====================================================
   V6.18 ORDER SEARCH + ADVANCED FILTERS
===================================================== */

.orders-search{
  height:40px;
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:7px;
  padding:0 10px;
  border:1px solid #e3e3dd;
  border-radius:13px;
  background:#fff;
}

.orders-search>span{
  flex:0 0 auto;
  color:#999;
  font-size:17px;
  line-height:1;
}

.orders-search input{
  min-width:0;
  height:100%;
  flex:1;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#171717;
  font-size:11px;
}

.orders-search input::placeholder{
  color:#aaa;
}

.orders-search button{
  width:27px;
  height:27px;
  flex:0 0 27px;
  padding:0;
  border:0;
  border-radius:9px;
  background:#f0f0ec;
  color:#777;
  font-size:15px;
}

.order-secondary-filters{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:5px;
  margin-top:7px;
}

.order-secondary-filters button{
  min-width:0;
  min-height:36px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:2px;
  padding:6px 9px;
  border:1px solid #e3e3dd;
  border-radius:11px;
  background:#fff;
  color:#171717;
  text-align:left;
}

.order-secondary-filters button span{
  display:block;
  color:#aaa;
  font-size:5.5px;
  font-weight:850;
  letter-spacing:.35px;
  text-transform:uppercase;
}

.order-secondary-filters button strong{
  display:block;
  max-width:100%;
  overflow:hidden;
  font-size:7.5px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.order-result-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:
    -2px
    0
    9px;
  padding:
    7px
    9px;
  border-radius:11px;
  background:#ecece8;
  color:#777;
  font-size:7px;
}

.order-result-summary strong{
  color:#171717;
}

.order-result-summary button{
  flex:0 0 auto;
  min-height:26px;
  padding:0 8px;
  border:0;
  border-radius:8px;
  background:#fff;
  color:#555;
  font-size:7px;
  font-weight:800;
}

@media(max-width:360px){
  .orders-search{
    height:38px;
  }

  .order-secondary-filters button{
    padding-left:7px;
    padding-right:7px;
  }

  .order-secondary-filters button strong{
    font-size:7px;
  }
}


/* =====================================================
   V6.18.1 CLEAN ORDER FILTER UX
===================================================== */

.order-secondary-filters{
  display:none !important;
}

.order-toolbar{
  display:grid;
  grid-template-columns:1fr .78fr;
  gap:6px;
  margin-top:7px;
}

.order-toolbar-button{
  min-width:0;
  min-height:42px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border:1px solid #e3e3dd;
  border-radius:12px;
  background:#fff;
  color:#171717;
  text-align:left;
  position:relative;
}

.order-toolbar-button.compact{
  justify-content:flex-start;
}

.order-toolbar-icon{
  width:26px;
  height:26px;
  flex:0 0 26px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#f1f1ed;
  color:#666;
  font-size:13px;
}

.order-toolbar-copy{
  min-width:0;
  flex:1;
}

.order-toolbar-copy strong{
  display:block;
  margin-bottom:2px;
  font-size:8px;
  font-weight:850;
}

.order-toolbar-copy small{
  display:block;
  overflow:hidden;
  color:#999991;
  font-size:6.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.order-filter-dot{
  width:7px;
  height:7px;
  flex:0 0 7px;
  border-radius:50%;
  background:#171717;
}

.order-filter-sheet{
  padding-bottom:
    max(
      20px,
      env(safe-area-inset-bottom)
    );
}

.order-filter-form-group{
  margin-top:14px;
}

.order-filter-form-group label{
  display:block;
  margin-bottom:7px;
  color:#777770;
  font-size:8px;
  font-weight:800;
}

.order-filter-form-group select{
  width:100%;
  min-height:46px;
  padding:0 12px;
  border:1px solid #deded8;
  border-radius:13px;
  background:#fafaf8;
  color:#171717;
  font-size:11px;
}

.order-filter-sheet-actions{
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:8px;
  margin-top:18px;
}

.order-filter-reset-button,
.order-filter-apply-button{
  min-height:44px;
  border-radius:13px;
  font-size:9px;
  font-weight:850;
}

.order-filter-reset-button{
  border:1px solid #deded8;
  background:#fff;
  color:#666;
}

.order-filter-apply-button{
  border:0;
  background:#171717;
  color:#fff;
}

#orders .orders-filter-sticky{
  padding-bottom:9px;
}

#orders .order-filter{
  gap:4px;
}

#orders .order-filter button{
  min-height:36px;
  border-radius:11px;
}

@media(max-width:360px){
  .order-toolbar{
    grid-template-columns:1fr .72fr;
  }

  .order-toolbar-button{
    min-height:40px;
    padding-left:8px;
    padding-right:8px;
  }
}


/* =====================================================
   V6.19 SELLER NOTIFICATION CENTER
===================================================== */

.home-top-actions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:7px;
}

.home-notification-button{
  width:42px;
  height:42px;
  flex:0 0 42px;
  position:relative;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid #e3e3dd;
  border-radius:14px;
  background:#fff;
  color:#171717;
  box-shadow:0 2px 10px rgba(0,0,0,.035);
}

.home-notification-bell{
  font-size:18px;
  line-height:1;
  transform:rotate(45deg);
}

.home-notification-badge{
  position:absolute;
  top:-4px;
  right:-4px;
  min-width:18px;
  height:18px;
  display:grid;
  place-items:center;
  padding:0 4px;
  border:2px solid #f5f5f2;
  border-radius:999px;
  background:#171717;
  color:#fff;
  font-size:6px;
  font-weight:850;
}

.seller-notification-sheet{
  max-height:88vh;
  overflow-y:auto;
  padding-bottom:
    max(
      20px,
      env(safe-area-inset-bottom)
    );
}

.seller-notification-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
  padding:11px 12px;
  border-radius:15px;
  background:#171717;
  color:#fff;
}

.seller-notification-summary>div{
  flex:0 0 auto;
}

.seller-notification-summary small{
  display:block;
  margin-bottom:3px;
  color:#8d8d88;
  font-size:6px;
  font-weight:850;
  letter-spacing:.5px;
}

.seller-notification-summary strong{
  display:block;
  font-size:18px;
  font-weight:850;
}

.seller-notification-summary p{
  max-width:210px;
  margin:0;
  color:#aaa;
  font-size:7.5px;
  line-height:1.4;
  text-align:right;
}

.seller-notification-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.seller-notification-item{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px;
  border:1px solid #e4e4df;
  border-radius:15px;
  background:#fff;
  color:#171717;
  text-align:left;
}

.seller-notification-icon{
  width:38px;
  height:38px;
  flex:0 0 38px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#f0f0ec;
  font-size:17px;
}

.seller-notification-item.payment_review .seller-notification-icon,
.seller-notification-item.shipping_payment .seller-notification-icon{
  background:#f2efff;
}

.seller-notification-item.ready_to_ship .seller-notification-icon{
  background:#eaf7f0;
}

.seller-notification-item.purchase .seller-notification-icon{
  background:#fff5e8;
}

.seller-notification-copy{
  min-width:0;
  flex:1;
}

.seller-notification-copy small{
  display:block;
  margin-bottom:2px;
  color:#999991;
  font-size:5.7px;
  font-weight:850;
  letter-spacing:.4px;
}

.seller-notification-copy strong{
  display:block;
  overflow:hidden;
  margin-bottom:2px;
  color:#171717;
  font-size:9.5px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.seller-notification-copy p{
  overflow:hidden;
  margin:0;
  color:#8d8d87;
  font-size:7.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.seller-notification-copy time{
  display:block;
  margin-top:4px;
  color:#aaa;
  font-size:6px;
}

.seller-notification-arrow{
  flex:0 0 auto;
  color:#aaa;
  font-size:18px;
}

.seller-notification-empty{
  padding:27px 18px;
  border:1px dashed #d9d9d4;
  border-radius:17px;
  background:#fafaf8;
  text-align:center;
}

.seller-notification-empty>div{
  width:45px;
  height:45px;
  display:grid;
  place-items:center;
  margin:0 auto 9px;
  border-radius:14px;
  background:#eaf7f0;
  color:#287454;
  font-size:18px;
  font-weight:850;
}

.seller-notification-empty h3{
  margin:0 0 4px;
  font-size:12px;
}

.seller-notification-empty p{
  max-width:240px;
  margin:0 auto;
  color:#999;
  font-size:8px;
  line-height:1.45;
}

@media(max-width:360px){
  .home-top-actions{
    gap:5px;
  }

  .home-notification-button,
  .home-avatar{
    width:39px;
    height:39px;
    flex-basis:39px;
  }
}


/* =====================================================
   V6.20 CUSTOMER MANAGEMENT
===================================================== */

#customers.customers-screen{
  padding:
    16px
    14px
    calc(
      32px +
      env(safe-area-inset-bottom)
    );
  background:#f5f5f2;
}

#customers .customers-header{
  display:grid;
  grid-template-columns:40px 1fr;
  align-items:center;
  gap:10px;
  margin:
    -16px
    -14px
    12px;
  padding:
    12px
    14px
    10px;
  border-bottom:1px solid rgba(222,222,216,.6);
  background:var(--app-header-bg);
}

#customers .customers-header>div{
  min-width:0;
}

#customers .customers-header small{
  display:block;
  margin-bottom:2px;
  color:#9a9a94;
  font-size:6px;
  font-weight:850;
  letter-spacing:.6px;
}

#customers .customers-header strong{
  display:block;
  font-size:13px;
  font-weight:850;
}

.customers-summary{
  display:grid;
  grid-template-columns:.75fr .9fr 1.35fr;
  gap:6px;
  margin-bottom:10px;
}

.customers-summary>div{
  min-width:0;
  padding:10px;
  border:1px solid #e3e3dd;
  border-radius:14px;
  background:#fff;
}

.customers-summary small{
  display:block;
  overflow:hidden;
  margin-bottom:4px;
  color:#999991;
  font-size:5.5px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.customers-summary strong{
  display:block;
  overflow:hidden;
  color:#171717;
  font-size:13px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.customers-summary>div:last-child strong{
  font-size:11px;
}

.customers-search{
  height:42px;
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
  padding:0 10px;
  border:1px solid #e3e3dd;
  border-radius:13px;
  background:#fff;
}

.customers-search>span{
  color:#999;
  font-size:16px;
}

.customers-search input{
  min-width:0;
  height:100%;
  flex:1;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:#171717;
  font-size:10.5px;
}

.customers-search input::placeholder{
  color:#aaa;
}

.customers-search button{
  width:27px;
  height:27px;
  padding:0;
  border:0;
  border-radius:9px;
  background:#f0f0ec;
  color:#777;
  font-size:15px;
}

.customer-result-summary{
  margin:
    0
    1px
    8px;
  color:#9a9a94;
  font-size:7px;
}

.customer-list{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.customer-card{
  width:100%;
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:11px;
  border:1px solid #e3e3dd;
  border-radius:17px;
  background:#fff;
  color:#171717;
  box-shadow:0 2px 10px rgba(0,0,0,.025);
  text-align:left;
}

.customer-avatar{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#f0f0ec;
  color:#555;
  font-size:12px;
  font-weight:850;
}

.customer-card-body{
  min-width:0;
  flex:1;
}

.customer-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
}

.customer-card-head>span{
  min-width:0;
  flex:1;
}

.customer-card-head strong{
  display:block;
  overflow:hidden;
  margin-bottom:2px;
  font-size:10.5px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.customer-card-head small{
  display:block;
  overflow:hidden;
  color:#999;
  font-size:7px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.customer-repeat-badge{
  flex:0 0 auto;
  min-height:20px;
  display:inline-flex;
  align-items:center;
  padding:0 7px;
  border-radius:999px;
  background:#eaf7f0;
  color:#287454;
  font-size:6px;
  font-weight:850;
}

.customer-location{
  display:block;
  overflow:hidden;
  margin-top:5px;
  color:#8d8d87;
  font-size:7.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.customer-stats{
  display:grid;
  grid-template-columns:.7fr .7fr 1.6fr;
  gap:5px;
  margin-top:9px;
}

.customer-stats>span{
  min-width:0;
  padding:7px;
  border-radius:10px;
  background:#f7f7f4;
}

.customer-stats small{
  display:block;
  margin-bottom:2px;
  color:#999;
  font-size:5px;
  font-weight:850;
}

.customer-stats strong{
  display:block;
  overflow:hidden;
  font-size:8.5px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.customer-last-order{
  display:block;
  margin-top:7px;
  color:#aaa;
  font-size:6px;
}

.customer-chevron{
  flex:0 0 auto;
  align-self:center;
  color:#aaa;
  font-size:18px;
}

.customer-empty{
  padding:28px 18px;
  border:1px dashed #d9d9d4;
  border-radius:18px;
  background:#fff;
  text-align:center;
}

.customer-empty>div{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  margin:0 auto 9px;
  border-radius:14px;
  background:#f0f0ec;
  font-size:20px;
}

.customer-empty h3{
  margin:0 0 5px;
  font-size:12px;
}

.customer-empty p{
  max-width:240px;
  margin:0 auto;
  color:#999;
  font-size:8px;
  line-height:1.45;
}

@media(max-width:360px){
  #customers.customers-screen{
    padding-left:12px;
    padding-right:12px;
  }

  #customers .customers-header{
    margin-left:-12px;
    margin-right:-12px;
    padding-left:12px;
    padding-right:12px;
  }

  .customers-summary{
    gap:5px;
  }

  .customers-summary>div{
    padding:9px 8px;
  }

  .customer-card{
    padding:10px;
  }
}


/* =====================================================
   V6.21 TRIP PROFITABILITY
===================================================== */

.trip-finance-card{
  margin-top:8px;
  padding:12px;
  border:1px solid #e4e4df;
  border-radius:17px;
  background:#fff;
}

.trip-finance-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.trip-finance-head small{
  display:block;
  margin-bottom:3px;
  color:#999991;
  font-size:6px;
  font-weight:850;
  letter-spacing:.5px;
}

.trip-finance-head h3{
  margin:0;
  color:#171717;
  font-size:11px;
  font-weight:850;
}

.trip-finance-status{
  flex:0 0 auto;
  min-height:22px;
  display:inline-flex;
  align-items:center;
  padding:0 8px;
  border-radius:999px;
  background:#f1f1ed;
  color:#777;
  font-size:6px;
  font-weight:850;
}

.trip-finance-status.complete{
  background:#eaf7f0;
  color:#287454;
}

.trip-finance-status.partial{
  background:#fff3df;
  color:#966523;
}

.trip-finance-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  margin-top:10px;
}

.trip-finance-grid>div{
  min-width:0;
  padding:9px;
  border-radius:12px;
  background:#f7f7f4;
}

.trip-finance-grid small{
  display:block;
  margin-bottom:4px;
  color:#999991;
  font-size:5.5px;
  font-weight:850;
}

.trip-finance-grid strong{
  display:block;
  overflow:hidden;
  color:#171717;
  font-size:10px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-finance-progress{
  margin-top:11px;
  padding-top:10px;
  border-top:1px solid #efefeb;
}

.trip-finance-progress-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:6px;
}

.trip-finance-progress-head span{
  color:#8f8f88;
  font-size:7px;
}

.trip-finance-progress-head strong{
  color:#171717;
  font-size:8px;
  font-weight:850;
}

.trip-finance-progress-track{
  height:6px;
  overflow:hidden;
  border-radius:999px;
  background:#ecece8;
}

.trip-finance-progress-track span{
  display:block;
  width:0;
  height:100%;
  border-radius:999px;
  background:#171717;
  transition:width .25s ease;
}

.trip-finance-progress p{
  margin:7px 0 0;
  color:#9a9a94;
  font-size:6.5px;
  line-height:1.45;
}


/* =====================================================
   V6.22 BUYER NOTE IN SELLER ORDER
===================================================== */

.order-buyer-note-card{
  background:#fffaf0;
  border-color:#eee1bf;
}

.order-buyer-note-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:9px;
}

.order-buyer-note-head>span{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#fff1d6;
  font-size:16px;
}

.order-buyer-note-head>div{
  min-width:0;
  flex:1;
}

.order-buyer-note-head strong{
  display:block;
  margin-bottom:2px;
  font-size:10px;
  font-weight:850;
}

.order-buyer-note-head small{
  display:block;
  color:#99865f;
  font-size:7px;
}

#orderBuyerNote{
  margin:10px 0 0;
  padding-top:10px;
  border-top:1px solid #eee1bf;
  color:#574c35;
  font-size:9px;
  line-height:1.55;
  white-space:pre-wrap;
}


/* =====================================================
   V6.22.3 SELLER SHIPPING DETAIL
===================================================== */

#nextOrderStatusButton{
  position:relative;
  z-index:2;
  pointer-events:auto;
  touch-action:manipulation;
}

.shipping-detail-hero{
  padding:15px;
  border-radius:17px;
  background:#171717;
  color:#fff;
}

.shipping-detail-hero small{
  display:block;
  margin-bottom:5px;
  color:#8f8f8b;
  font-size:6px;
  font-weight:850;
  letter-spacing:.5px;
}

.shipping-detail-hero strong{
  display:block;
  font-size:20px;
  font-weight:850;
}

.shipping-detail-hero span{
  display:block;
  margin-top:4px;
  color:#aaa;
  font-size:7px;
}

.shipping-detail-status{
  display:flex;
  align-items:center;
  gap:9px;
  margin-top:9px;
  padding:10px 11px;
  border-radius:13px;
  background:#f5f5f1;
}

.shipping-detail-status>span{
  width:9px;
  height:9px;
  flex:0 0 9px;
  border-radius:50%;
  background:#b79b58;
}

.shipping-detail-status.submitted>span{
  background:#7150a0;
}

.shipping-detail-status.verified>span{
  background:#24764d;
}

.shipping-detail-status.rejected>span{
  background:#b43b3b;
}

.shipping-detail-status small{
  display:block;
  margin-bottom:2px;
  font-size:5.5px;
  font-weight:850;
}

.shipping-detail-status strong{
  display:block;
  font-size:9px;
}

.shipping-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  margin-top:9px;
}

.shipping-detail-grid>div,
.shipping-detail-address{
  min-width:0;
  padding:10px;
  border:1px solid #e5e5df;
  border-radius:13px;
  background:#fafaf8;
}

.shipping-detail-grid small,
.shipping-detail-address small{
  display:block;
  margin-bottom:4px;
  color:#999;
  font-size:5.5px;
  font-weight:850;
}

.shipping-detail-grid strong{
  display:block;
  overflow:hidden;
  font-size:8.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.shipping-detail-address{
  margin-top:6px;
}

.shipping-detail-address p{
  margin:0;
  color:#666;
  font-size:8px;
  line-height:1.5;
}

.shipping-detail-actions{
  margin-top:12px;
}

.shipping-detail-actions button{
  width:100%;
  min-height:44px;
  border-radius:13px;
  font-size:9px;
  font-weight:850;
}

.shipping-detail-actions .secondary{
  border:1px solid #deded8;
  background:#fff;
  color:#171717;
}


/* =====================================================
   V6.26 PURCHASE CHECKLIST MODE
===================================================== */

.purchase-checklist-progress{
  margin:0 0 17px;
  padding:12px;
  border:1px solid #e5e5df;
  border-radius:16px;
  background:#fff;
}

.purchase-checklist-progress-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.purchase-checklist-progress-head small{
  display:block;
  margin-bottom:3px;
  color:#999;
  font-size:5.8px;
  font-weight:850;
  letter-spacing:.55px;
}

.purchase-checklist-progress-head strong{
  display:block;
  font-size:10px;
}

.purchase-checklist-progress-head>span{
  font-size:10px;
  font-weight:850;
}

.purchase-checklist-track{
  overflow:hidden;
  height:6px;
  margin-top:10px;
  border-radius:999px;
  background:#ecece7;
}

.purchase-checklist-track>span{
  width:0;
  height:100%;
  display:block;
  border-radius:inherit;
  background:#171717;
  transition:width .2s ease;
}

.purchase-checklist-progress>p{
  margin:8px 0 0;
  color:#888;
  font-size:7.5px;
  line-height:1.4;
}

.purchase-checklist-card{
  margin-bottom:8px;
  padding:11px;
  border:1px solid #e4e4df;
  border-radius:17px;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.025);
}

.purchase-checklist-card.complete{
  background:#fbfcfa;
  border-color:#dfe9e2;
}

.purchase-checklist-main{
  display:flex;
  align-items:center;
  gap:9px;
}

.purchase-checkmark{
  width:22px;
  height:22px;
  flex:0 0 22px;
  display:grid;
  place-items:center;
  border:2px solid #c8c8c2;
  border-radius:50%;
  color:#fff;
  font-size:10px;
  font-weight:900;
}

.purchase-checklist-card.complete
.purchase-checkmark{
  border-color:#24764d;
  background:#24764d;
}

.purchase-checklist-copy{
  min-width:0;
  flex:1;
}

.purchase-checklist-copy small{
  display:block;
  margin-bottom:3px;
  color:#999;
  font-size:5.8px;
  font-weight:850;
  letter-spacing:.4px;
}

.purchase-checklist-card.complete
.purchase-checklist-copy small{
  color:#24764d;
}

.purchase-checklist-copy h3{
  overflow:hidden;
  margin:0 0 3px;
  font-size:11px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.purchase-checklist-copy p{
  margin:0;
  color:#888;
  font-size:7px;
}

.purchase-checklist-remaining{
  flex:0 0 auto;
  font-size:10px;
}

.purchase-checklist-card.complete
.purchase-checklist-remaining{
  color:#24764d;
  font-size:8px;
}

.purchase-checklist-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:5px;
  margin-top:10px;
}

.purchase-checklist-stats>span{
  padding:7px;
  border-radius:10px;
  background:#f6f6f3;
}

.purchase-checklist-stats small{
  display:block;
  margin-bottom:2px;
  color:#999;
  font-size:5.5px;
  font-weight:800;
}

.purchase-checklist-stats strong{
  display:block;
  font-size:10px;
}

.purchase-checklist-buyers{
  margin-top:9px;
  border-top:1px solid #efefeb;
}

.purchase-checklist-buyers summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:9px 1px 3px;
  cursor:pointer;
  list-style:none;
}

.purchase-checklist-buyers summary::-webkit-details-marker{
  display:none;
}

.purchase-checklist-buyers summary span{
  font-size:7px;
  font-weight:850;
  letter-spacing:.35px;
  text-transform:uppercase;
}

.purchase-checklist-buyers summary small{
  font-size:6.5px;
}

.purchase-checklist-buyer{
  padding:9px 0;
  border-top:1px solid #f1f1ed;
}

.purchase-checklist-buyer:first-child{
  border-top:0;
}

.purchase-checklist-buyer-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.purchase-checklist-buyer-head strong{
  display:block;
  font-size:8.5px;
}

.purchase-checklist-buyer-head small{
  display:block;
  margin-top:2px;
  color:#999;
  font-size:5.8px;
}

.purchase-checklist-buyer-head>span{
  flex:0 0 auto;
  min-height:20px;
  display:inline-flex;
  align-items:center;
  padding:0 7px;
  border-radius:999px;
  background:#fff4e6;
  color:#98651f;
  font-size:6px;
  font-weight:850;
}

.purchase-checklist-buyer.complete
.purchase-checklist-buyer-head>span{
  background:#eaf7f0;
  color:#287454;
}

.purchase-checklist-buyer-qty{
  display:flex;
  gap:9px;
  margin-top:5px;
  color:#888;
  font-size:6.5px;
}

.purchase-checklist-note{
  margin-top:7px;
  padding:8px 9px;
  border-radius:10px;
  background:#fff8e8;
}

.purchase-checklist-note small{
  display:block;
  margin-bottom:3px;
  color:#9c6800;
  font-size:5.5px;
  font-weight:900;
  letter-spacing:.45px;
}

.purchase-checklist-note p{
  margin:0;
  color:#6f5a2e;
  font-size:7.2px;
  line-height:1.45;
}

.purchase-checklist-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:9px;
  padding-top:9px;
  border-top:1px solid #efefeb;
}

.purchase-checklist-footer>div{
  min-width:0;
}

.purchase-checklist-footer small{
  display:block;
  margin-bottom:2px;
  color:#999;
  font-size:5.5px;
  font-weight:800;
}

.purchase-checklist-footer strong{
  display:block;
  font-size:9.5px;
}

.purchase-checklist-done-label{
  display:inline-flex;
  align-items:center;
  min-height:31px;
  padding:0 10px;
  border-radius:10px;
  background:#eaf7f0;
  color:#287454;
  font-size:7px;
  font-weight:850;
}

@media(max-width:360px){
  .purchase-checklist-main{
    gap:7px;
  }

  .purchase-checkmark{
    width:20px;
    height:20px;
    flex-basis:20px;
  }

  .purchase-checklist-card
  .purchase-item-image{
    width:46px;
    height:46px;
    flex-basis:46px;
  }
}


/* V6.27.1 seller payment-state status badges */
.order-status.payment_submitted{
  background:#f0edff;
  color:#6b5aa8;
}

.order-status.payment_rejected{
  background:#fff0f0;
  color:#a65353;
}


/* =====================================================
   V6.28 TRIP REPORT
===================================================== */

.trip-report-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.trip-report-heading>div:first-child{
  min-width:0;
  flex:1;
}

.trip-report-heading small,
.trip-report-section-head small{
  display:block;
  margin-bottom:4px;
  color:#92928a;
  font-size:6px;
  font-weight:850;
  letter-spacing:.55px;
}

.trip-report-heading h2,
.trip-report-section-head h3{
  margin:0;
}

.trip-report-heading h2{
  font-size:17px;
}

.trip-report-heading p{
  max-width:420px;
  margin:6px 0 0;
  color:#85857e;
  font-size:8px;
  line-height:1.45;
}

.trip-report-actions{
  flex:0 0 auto;
  display:flex;
  gap:6px;
}

.trip-report-action{
  min-height:32px;
  padding:0 10px;
  border:1px solid #deded8;
  border-radius:10px;
  background:#fff;
  color:#202020;
  font-size:7px;
  font-weight:800;
}

.trip-report-action.primary{
  border-color:#171717;
  background:#171717;
  color:#fff;
}

.trip-report-kpi-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:7px;
}

.trip-report-kpi{
  min-width:0;
  padding:11px;
  border:1px solid #e5e5df;
  border-radius:14px;
  background:#fff;
}

.trip-report-kpi.highlight{
  background:#171717;
  color:#fff;
  border-color:#171717;
}

.trip-report-kpi small{
  display:block;
  margin-bottom:5px;
  color:#999;
  font-size:5.5px;
  font-weight:850;
  letter-spacing:.45px;
}

.trip-report-kpi.highlight small,
.trip-report-kpi.highlight span{
  color:#bdbdb8;
}

.trip-report-kpi strong{
  display:block;
  overflow:hidden;
  font-size:12px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-report-kpi span{
  display:block;
  margin-top:3px;
  color:#8c8c85;
  font-size:6px;
}

.trip-report-section{
  margin-top:15px;
  padding:12px;
  border:1px solid #e5e5df;
  border-radius:16px;
  background:#fff;
}

.trip-report-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}

.trip-report-section-head h3{
  font-size:11px;
}

.trip-report-status-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
}

.trip-report-status-row{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:8px;
  border-radius:11px;
  background:#f7f7f4;
}

.trip-report-status-row .order-status{
  max-width:calc(100% - 28px);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-report-status-row>strong{
  font-size:10px;
}

.trip-report-product-list,
.trip-report-buyer-list{
  display:flex;
  flex-direction:column;
}

.trip-report-product-row{
  display:grid;
  grid-template-columns:24px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  padding:9px 0;
  border-top:1px solid #f0f0ec;
}

.trip-report-product-row:first-child,
.trip-report-buyer-row:first-child{
  border-top:0;
}

.trip-report-rank{
  width:23px;
  height:23px;
  display:grid;
  place-items:center;
  border-radius:8px;
  background:#f1f1ed;
  font-size:7px;
  font-weight:850;
}

.trip-report-product-row>div{
  min-width:0;
}

.trip-report-product-row>div strong{
  display:block;
  overflow:hidden;
  font-size:8.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-report-product-row small{
  display:block;
  margin-top:3px;
  color:#92928b;
  font-size:6.5px;
}

.trip-report-product-row>strong{
  font-size:8.5px;
  white-space:nowrap;
}

.trip-report-buyer-row{
  display:flex;
  align-items:center;
  gap:9px;
  padding:9px 0;
  border-top:1px solid #f0f0ec;
}

.trip-report-buyer-avatar{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#f1f1ed;
  font-size:10px;
  font-weight:850;
}

.trip-report-buyer-copy{
  min-width:0;
  flex:1;
}

.trip-report-buyer-copy strong{
  display:block;
  overflow:hidden;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-report-buyer-copy small{
  display:block;
  margin-top:3px;
  color:#92928b;
  font-size:6.5px;
}

.trip-report-buyer-total{
  flex:0 0 auto;
  display:flex;
  align-items:flex-end;
  flex-direction:column;
  gap:4px;
}

.trip-report-buyer-total>strong{
  font-size:8.5px;
}

.trip-report-buyer-total .order-status{
  font-size:5.7px;
  padding:4px 6px;
}

.trip-report-shipping-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
}

.trip-report-shipping-grid>div{
  padding:9px;
  border-radius:11px;
  background:#f7f7f4;
}

.trip-report-shipping-grid small{
  display:block;
  margin-bottom:4px;
  color:#999;
  font-size:5.5px;
  font-weight:850;
}

.trip-report-shipping-grid strong{
  display:block;
  overflow:hidden;
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.trip-report-empty{
  padding:13px;
  border-radius:11px;
  background:#f7f7f4;
  color:#8b8b84;
  font-size:7px;
  line-height:1.45;
  text-align:center;
}

@media(max-width:420px){
  .trip-report-heading{
    flex-direction:column;
  }

  .trip-report-actions{
    width:100%;
  }

  .trip-report-action{
    flex:1;
  }
}

@media(max-width:360px){
  .trip-report-kpi-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* =====================================================
   V6.29 SELLER ONBOARDING
===================================================== */

.seller-onboarding{
  position:fixed;
  z-index:200;
  inset:0;
  display:flex;
  justify-content:center;
  background:#f7f7f5;
  overflow:auto;
}

.seller-onboarding.hidden{
  display:none;
}

.seller-onboarding-shell{
  width:min(100%,430px);
  min-height:100dvh;
  padding:
    max(24px,env(safe-area-inset-top))
    20px
    max(28px,env(safe-area-inset-bottom));
  background:#f7f7f5;
}

.seller-onboarding-brand{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:20px;
}

.seller-onboarding-brand>span{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#171717;
  color:#fff;
  font-size:12px;
  font-weight:900;
}

.seller-onboarding-brand>strong{
  font-size:14px;
}

.seller-onboarding-progress{
  height:4px;
  margin-bottom:30px;
  overflow:hidden;
  border-radius:999px;
  background:#e8e8e3;
}

.seller-onboarding-progress>span{
  width:33.33%;
  height:100%;
  display:block;
  border-radius:inherit;
  background:#171717;
  transition:width .2s ease;
}

.seller-onboarding-step>small{
  display:block;
  margin-bottom:7px;
  color:#999991;
  font-size:7px;
  font-weight:850;
  letter-spacing:.75px;
}

.seller-onboarding-step h1{
  margin:0;
  font-size:27px;
  line-height:1.05;
}

.seller-onboarding-step>p{
  margin:8px 0 24px;
  color:#7d7d76;
  font-size:10px;
  line-height:1.5;
}

.seller-onboarding-step label{
  display:block;
  margin:15px 0 7px;
  font-size:8px;
  font-weight:800;
}

.seller-onboarding-step input,
.seller-onboarding-step select{
  width:100%;
  min-height:48px;
  margin:0;
  padding:0 14px;
  border:1px solid #deded8;
  border-radius:14px;
  background:#fff;
  font-size:12px;
  outline:none;
}

.seller-onboarding-step input:focus,
.seller-onboarding-step select:focus{
  border-color:#8f8f88;
}

.seller-onboarding-slug{
  display:flex;
  align-items:center;
  overflow:hidden;
  border:1px solid #deded8;
  border-radius:14px;
  background:#fff;
}

.seller-onboarding-slug>span{
  padding-left:14px;
  color:#85857e;
  font-size:12px;
  font-weight:750;
}

.seller-onboarding-slug>input{
  min-width:0;
  border:0;
  border-radius:0;
  padding-left:4px;
}

.seller-onboarding-preview{
  margin-top:8px;
  padding:11px 13px;
  border-radius:12px;
  background:#efefeb;
}

.seller-onboarding-preview small{
  display:block;
  margin-bottom:3px;
  color:#999991;
  font-size:6px;
  font-weight:850;
}

.seller-onboarding-preview strong{
  display:block;
  overflow:hidden;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.seller-onboarding-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.seller-onboarding-primary,
.seller-onboarding-secondary,
.seller-onboarding-actions>button{
  min-height:48px;
  border-radius:14px;
  font-size:9px;
  font-weight:850;
}

.seller-onboarding-primary{
  width:100%;
  margin-top:26px;
  border:0;
  background:#171717;
  color:#fff;
}

.seller-onboarding-secondary{
  width:100%;
  margin-top:8px;
  border:1px solid #dcdcd6;
  background:#fff;
  color:#171717;
}

.seller-onboarding-actions{
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:8px;
  margin-top:26px;
}

.seller-onboarding-actions>button{
  margin:0;
  border:1px solid #dcdcd6;
  background:#fff;
  color:#171717;
}

.seller-onboarding-actions>.seller-onboarding-primary{
  border-color:#171717;
  background:#171717;
  color:#fff;
}

.seller-onboarding-done-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin:24px 0 18px;
  border-radius:20px;
  background:#171717;
  color:#fff;
  font-size:22px;
  font-weight:900;
}

.seller-onboarding-summary{
  margin-top:22px;
  padding:4px 14px;
  border:1px solid #e4e4df;
  border-radius:17px;
  background:#fff;
}

.seller-onboarding-summary>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 0;
  border-top:1px solid #f0f0ec;
}

.seller-onboarding-summary>div:first-child{
  border-top:0;
}

.seller-onboarding-summary small{
  color:#999991;
  font-size:6px;
  font-weight:850;
}

.seller-onboarding-summary strong{
  max-width:65%;
  overflow:hidden;
  font-size:9px;
  text-align:right;
  text-overflow:ellipsis;
  white-space:nowrap;
}


/* =====================================================
   V6.31 SELLER GETTING STARTED
===================================================== */

.seller-getting-started{
  margin-bottom:14px;
  padding:15px;
  border:1px solid #e2e2dc;
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow-card);
}

.seller-guide-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.seller-guide-head>div{
  min-width:0;
  flex:1;
}

.seller-guide-head small{
  display:block;
  margin-bottom:4px;
  color:#94948d;
  font-size:6px;
  font-weight:850;
  letter-spacing:.65px;
}

.seller-guide-head h2{
  margin:0;
  font-size:15px;
}

.seller-guide-head p{
  margin:5px 0 0;
  color:#85857e;
  font-size:8px;
  line-height:1.4;
}

#sellerGuideProgress{
  flex:0 0 auto;
  min-width:38px;
  padding:7px 8px;
  border-radius:10px;
  background:#171717;
  color:#fff;
  font-size:8px;
  font-weight:850;
  text-align:center;
}

.seller-guide-progress-track{
  height:5px;
  margin:13px 0 10px;
  overflow:hidden;
  border-radius:999px;
  background:#ecece7;
}

.seller-guide-progress-track>span{
  width:0;
  height:100%;
  display:block;
  border-radius:inherit;
  background:#171717;
  transition:width .25s ease;
}

.seller-guide-list{
  display:flex;
  flex-direction:column;
}

.seller-guide-step{
  width:100%;
  display:flex;
  align-items:center;
  gap:9px;
  min-height:52px;
  padding:9px 0;
  border:0;
  border-top:1px solid #f0f0ec;
  background:transparent;
  color:#171717;
  text-align:left;
}

.seller-guide-step:first-child{
  border-top:0;
}

.seller-guide-step:disabled{
  opacity:1;
}

.seller-guide-step-icon{
  width:29px;
  height:29px;
  flex:0 0 29px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#171717;
  color:#fff;
  font-size:8px;
  font-weight:900;
}

.seller-guide-step.done .seller-guide-step-icon{
  background:#e9f5ec;
  color:#347148;
}

.seller-guide-step-copy{
  min-width:0;
  flex:1;
}

.seller-guide-step-copy strong{
  display:block;
  margin-bottom:3px;
  font-size:9px;
}

.seller-guide-step-copy small{
  display:block;
  color:#92928b;
  font-size:6.5px;
  line-height:1.4;
}

.seller-guide-step-action{
  flex:0 0 auto;
  color:#777770;
  font-size:6.5px;
  font-weight:800;
  white-space:nowrap;
}

.seller-guide-step:not(.done) .seller-guide-step-action{
  color:#171717;
}

.seller-guide-step.done .seller-guide-step-copy strong{
  color:#777770;
}


/* =====================================================
   V6.32 SELLER AUTH
===================================================== */

.seller-auth{
  position:fixed;
  z-index:260;
  inset:0;
  display:flex;
  justify-content:center;
  overflow:auto;
  background:#f7f7f5;
}

.seller-auth.hidden{
  display:none;
}

.seller-auth-shell{
  width:min(100%,430px);
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  padding:
    max(32px,env(safe-area-inset-top))
    22px
    max(26px,env(safe-area-inset-bottom));
}

.seller-auth-hero{
  margin-top:7vh;
}

.seller-auth-logo{
  width:52px;
  height:52px;
  display:grid;
  place-items:center;
  margin-bottom:24px;
  border-radius:17px;
  background:#171717;
  color:#fff;
  font-size:18px;
  font-weight:900;
  box-shadow:0 12px 28px rgba(0,0,0,.12);
}

.seller-auth-hero small{
  display:block;
  margin-bottom:7px;
  color:#92928b;
  font-size:7px;
  font-weight:850;
  letter-spacing:.8px;
}

.seller-auth-hero h1{
  margin:0;
  font-size:29px;
  line-height:1.05;
  letter-spacing:-.6px;
}

.seller-auth-hero p{
  max-width:320px;
  margin:9px 0 0;
  color:#7d7d76;
  font-size:10px;
  line-height:1.55;
}

.seller-auth-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4px;
  margin-top:30px;
  padding:4px;
  border-radius:14px;
  background:#ecece7;
}

.seller-auth-tabs button{
  min-height:39px;
  border:0;
  border-radius:11px;
  background:transparent;
  color:#7c7c75;
  font-size:9px;
  font-weight:850;
}

.seller-auth-tabs button.active{
  background:#fff;
  color:#171717;
  box-shadow:0 3px 10px rgba(0,0,0,.06);
}

.seller-auth-form{
  margin-top:17px;
}

.seller-auth-form label{
  display:block;
  margin:14px 0 7px;
  font-size:8px;
  font-weight:800;
}

.seller-auth-form input{
  width:100%;
  min-height:50px;
  margin:0;
  padding:0 14px;
  border:1px solid #deded8;
  border-radius:14px;
  background:#fff;
  color:#171717;
  font-size:12px;
  outline:none;
}

.seller-auth-form input:focus{
  border-color:#8d8d86;
  box-shadow:0 0 0 3px rgba(0,0,0,.035);
}

.seller-auth-password{
  position:relative;
}

.seller-auth-password input{
  padding-right:66px;
}

.seller-auth-password button{
  position:absolute;
  top:50%;
  right:8px;
  transform:translateY(-50%);
  min-height:34px;
  padding:0 10px;
  border:0;
  border-radius:9px;
  background:#f1f1ed;
  color:#66665f;
  font-size:7px;
  font-weight:850;
}

.seller-auth-message{
  margin-top:13px;
  padding:10px 12px;
  border-radius:12px;
  font-size:8px;
  font-weight:750;
  line-height:1.4;
}

.seller-auth-message.error{
  background:#fff0f0;
  color:#9b4444;
}

.seller-auth-message.success{
  background:#edf8ef;
  color:#347246;
}

.seller-auth-submit{
  width:100%;
  min-height:50px;
  margin-top:22px;
  border:0;
  border-radius:14px;
  background:#171717;
  color:#fff;
  font-size:9px;
  font-weight:850;
}

.seller-auth-submit:disabled{
  opacity:.55;
}

.seller-auth-foot{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:auto;
  padding-top:30px;
}

.seller-auth-foot span{
  height:1px;
  flex:1;
  background:#e1e1dc;
}

.seller-auth-foot small{
  color:#a0a099;
  font-size:6px;
  font-weight:750;
  letter-spacing:.35px;
  white-space:nowrap;
}

/* =====================================================
   V6.34 SELLER MOBILE APP POLISH
   Unified native-style pass for every seller surface.
===================================================== */

:root{
  --app-bg:#f4f4f1;
  --app-surface:#ffffff;
  --app-surface-soft:#f8f8f5;
  --app-text:#161616;
  --app-muted:#86867f;
  --app-line:#e5e5df;
  --app-header-bg:rgba(244,244,241,.94);
  --app-radius:18px;
  --app-radius-sm:14px;
  --app-shadow:0 3px 14px rgba(20,20,20,.045);
  --app-shadow-sheet:0 -18px 50px rgba(20,20,20,.13);
  --app-touch:44px;
}

html{
  background:#d9d9d5;
  overscroll-behavior-y:none;
}

body{
  min-height:100dvh;
  background:#d9d9d5;
  overscroll-behavior-y:none;
}

.app{
  position:relative;
  width:100%;
  max-width:430px;
  min-height:100dvh;
  margin:0 auto;
  overflow-x:hidden;
  background:var(--app-bg);
  box-shadow:0 0 0 1px rgba(0,0,0,.025);
}

.screen{
  min-height:100dvh;
  padding:
    max(16px,env(safe-area-inset-top))
    14px
    calc(96px + env(safe-area-inset-bottom));
  background:var(--app-bg);
}

#home.home-screen,
#trips.trips-screen,
#orders.orders-screen,
#tripDetail.trip-detail-screen,
#productDetail,
#orderDetail,
#shipping,
#customers.customers-screen,
#business{
  padding-left:14px;
  padding-right:14px;
  background:var(--app-bg);
}

button,
a,
[onclick]{
  touch-action:manipulation;
}

button{
  min-height:var(--app-touch);
}

input,
select,
textarea{
  width:100%;
  min-height:48px;
  padding:0 14px;
  border:1px solid var(--app-line);
  border-radius:14px;
  background:var(--app-surface);
  color:var(--app-text);
  font-size:16px;
  outline:none;
  box-shadow:none;
}

textarea{
  min-height:104px;
  padding-top:13px;
  padding-bottom:13px;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#aaa9a1;
  box-shadow:0 0 0 3px rgba(20,20,20,.035);
}

label{
  color:#51514c;
  font-size:12px;
  font-weight:750;
}

small{
  font-size:11px;
  line-height:1.35;
}

h1{
  font-size:26px;
  letter-spacing:-.65px;
}

h2{
  font-size:19px;
  letter-spacing:-.3px;
}

h3{
  font-size:15px;
}

p{
  line-height:1.5;
}

/* Native top bars */
.home-topbar,
.mobile-page-header,
.trip-detail-topbar,
.customers-header,
.back-header{
  position:sticky;
  z-index:40;
  top:0;
  min-height:60px;
  margin:
    calc(-1 * max(16px,env(safe-area-inset-top)))
    -14px
    14px;
  padding:
    max(12px,env(safe-area-inset-top))
    14px
    10px;
  border-bottom:1px solid rgba(218,218,212,.72);
  background:var(--app-header-bg);
  backdrop-filter:blur(18px) saturate(1.25);
  -webkit-backdrop-filter:blur(18px) saturate(1.25);
}

.home-title-block>small,
.mobile-page-header small,
.trip-detail-topbar small,
.customers-header small{
  font-size:9px;
  letter-spacing:.65px;
}

.home-title-block h1,
.mobile-page-header h1{
  font-size:22px;
}

.home-title-block p,
.mobile-page-header p{
  font-size:11px;
}

.home-avatar,
.home-notification-button,
.mobile-header-action,
.trip-detail-back,
.trip-detail-more,
.back-header>button,
.customers-header>button{
  width:42px;
  height:42px;
  min-height:42px;
  flex:0 0 42px;
  border-radius:14px;
}

/* Cards */
.card,
.home-kpi-card,
.home-action-grid>button,
.home-all-trips,
.seller-getting-started,
.trip-status-summary>div,
.trip-mobile-card,
.trip-detail-summary>div,
.trip-storefront-card,
.trip-finance-card,
.trip-report-kpi,
.trip-report-section,
.order-card,
.order-detail-card,
.order-process-card,
.shipping-card,
.shipping-history-card,
.customer-card,
.business-profile,
.seller-payment-card,
.purchase-summary-card,
.purchase-product-preview,
.purchase-checklist-progress,
.store-settings-block,
.trip-settings-current,
.trip-settings-storefront,
.seller-notification-summary{
  border-color:var(--app-line);
  border-radius:var(--app-radius);
  background:var(--app-surface);
  box-shadow:var(--app-shadow);
}

/* Home */
.home-trip-card{
  border-radius:22px;
  box-shadow:0 8px 28px rgba(0,0,0,.10);
}

.home-section-head{
  margin-top:22px;
  margin-bottom:10px;
}

.home-section-head small{
  font-size:9px;
}

.home-section-head h2{
  font-size:17px;
}

.home-kpi-grid{
  gap:8px;
}

.home-kpi-card{
  min-height:78px;
  padding:12px;
}

.home-kpi-card span{
  margin-bottom:6px;
  font-size:10px;
}

.home-kpi-card strong,
.home-kpi-card:first-child strong{
  font-size:15px;
}

.home-action-grid{
  gap:8px;
}

.home-action-grid>button{
  min-height:82px;
  padding:12px;
}

.home-action-icon{
  width:40px;
  height:40px;
  flex-basis:40px;
  border-radius:13px;
}

.home-action-copy strong{
  font-size:12px;
}

.home-action-copy small{
  font-size:10px;
}

.home-attention-card{
  min-height:68px;
  padding:12px;
  border-radius:17px;
}

.home-attention-copy small{
  font-size:9px;
}

.home-attention-copy strong{
  font-size:12px;
}

.home-attention-copy p{
  font-size:10px;
}

/* Getting started */
.seller-getting-started{
  padding:15px;
}

.seller-guide-head small{
  font-size:9px;
}

.seller-guide-head h2{
  font-size:16px;
}

.seller-guide-head p{
  font-size:10px;
}

#sellerGuideProgress{
  min-width:42px;
  font-size:10px;
}

.seller-guide-step{
  min-height:58px;
}

.seller-guide-step-icon{
  width:34px;
  height:34px;
  flex-basis:34px;
  font-size:10px;
}

.seller-guide-step-copy strong{
  font-size:11px;
}

.seller-guide-step-copy small,
.seller-guide-step-action{
  font-size:9px;
}

/* Trips */
.trip-status-summary{
  gap:8px;
}

.trip-status-summary>div{
  min-height:66px;
  padding:11px;
}

.trip-status-summary small{
  font-size:8.5px;
}

.trip-status-summary strong{
  font-size:16px;
}

#tripList{
  gap:10px;
}

.trip-mobile-card{
  min-height:112px;
}

.trip-mobile-accent{
  width:54px;
  flex-basis:54px;
  padding-top:18px;
}

.trip-mobile-content{
  padding:14px 13px 12px;
}

.trip-mobile-status,
.trip-mobile-publish span{
  min-height:23px;
  font-size:8px;
}

.trip-mobile-title-row h3{
  font-size:15px;
}

.trip-mobile-title-row p{
  font-size:10px;
}

.trip-mobile-meta{
  gap:16px;
}

.trip-mobile-meta span{
  font-size:8px;
}

.trip-mobile-meta b{
  font-size:11px;
}

/* Trip detail */
.trip-detail-hero{
  border-radius:22px;
}

.trip-detail-hero h1{
  font-size:23px;
}

.trip-detail-hero p{
  font-size:11px;
}

.trip-detail-mini-badge{
  min-height:24px;
  font-size:9px;
}

.trip-detail-summary{
  gap:8px;
}

.trip-detail-summary>div{
  min-height:70px;
  padding:12px;
}

.trip-detail-summary small{
  font-size:9px;
}

.trip-detail-summary strong,
.trip-detail-summary .revenue strong{
  font-size:14px;
}

.trip-storefront-card{
  min-height:66px;
  padding:12px;
}

.trip-storefront-main small{
  font-size:8.5px;
}

.trip-storefront-main h3{
  font-size:12px;
}

.trip-storefront-main p{
  font-size:9px;
}

.trip-storefront-action,
.trip-add-inline{
  min-height:38px;
  font-size:10px;
}

.trip-detail-tabs.tabs{
  top:0;
  gap:6px;
  padding-top:8px;
  padding-bottom:8px;
}

.trip-detail-tabs.tabs button{
  min-height:40px;
  font-size:10px;
}

.trip-tab-section-head small{
  font-size:9px;
}

.trip-tab-section-head h2{
  font-size:19px;
}

/* Product rows / product detail */
.trip-product-row{
  min-height:82px;
  padding:11px;
  border-radius:17px;
}

.trip-product-thumb{
  width:62px;
  height:62px;
  flex-basis:62px;
}

.trip-product-title-wrap h3{
  font-size:13px;
}

.trip-product-title-wrap>span{
  font-size:10px;
}

.trip-product-publish{
  font-size:8px;
}

#productDetail .back-header,
#orderDetail .back-header{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:10px;
}

.product-info,
.product-card,
.product-meta,
.price-calculator{
  border-radius:var(--app-radius);
}

/* Purchase */
.purchase-heading small,
.purchase-section-head small{
  font-size:9px;
}

.purchase-heading h2,
.purchase-section-head h3{
  font-size:17px;
}

.purchase-heading p{
  font-size:10px;
}

.purchase-summary-grid{
  gap:8px;
}

.purchase-summary-card{
  min-height:76px;
  padding:12px;
}

.purchase-summary-card small{
  font-size:8.5px;
}

.purchase-summary-card strong{
  font-size:18px;
}

.purchase-count-badge{
  min-height:25px;
  padding:0 9px;
  font-size:9px;
}

.purchase-checklist-progress{
  padding:12px;
}

.purchase-checklist-progress-head small,
.purchase-rate-hint,
.purchase-variance-row{
  font-size:9px;
}

.purchase-product-preview{
  padding:11px;
}

.purchase-product-image{
  width:54px;
  height:54px;
  flex-basis:54px;
}

.purchase-requirement{
  gap:7px;
}

.purchase-requirement>div{
  min-height:58px;
  padding:9px;
  border-radius:12px;
}

.purchase-requirement small{
  font-size:8px;
}

.purchase-requirement strong{
  font-size:13px;
}

.purchase-method-options button,
.markup-options button,
.reject-reason-options button{
  min-height:42px;
  font-size:10px;
}

/* Orders */
.orders-filter-sticky{
  top:0;
  margin-left:-14px;
  margin-right:-14px;
  padding-left:14px;
  padding-right:14px;
}

#orders .order-filter{
  display:flex;
  gap:7px;
}

#orders .order-filter button{
  flex:0 0 auto;
  min-width:82px;
  min-height:40px;
  padding:0 12px;
  border-radius:12px;
  font-size:10px;
}

#orders .order-filter button b{
  min-width:20px;
  height:20px;
  font-size:8px;
}

.orders-search,
.customers-search{
  min-height:46px;
  border-radius:14px;
}

.orders-search input,
.customers-search input{
  font-size:14px;
}

.order-result-summary,
.customer-result-summary{
  font-size:10px;
}

#globalOrders{
  gap:10px;
}

#globalOrders .order-card{
  padding:13px;
}

.order-customer-avatar{
  width:42px;
  height:42px;
  flex-basis:42px;
  border-radius:13px;
  font-size:13px;
}

#globalOrders .order-card-head small{
  font-size:8.5px;
}

#globalOrders .order-card-head h3{
  font-size:13px;
}

#globalOrders .order-card-body,
#globalOrders .order-card-footer,
#globalOrders .order-payment-notice{
  margin-left:51px;
}

#globalOrders .order-card-footer small{
  font-size:9px;
}

#globalOrders .order-card-footer strong{
  font-size:13px;
}

#globalOrders .order-payment-notice{
  font-size:9px;
}

.order-status{
  min-height:23px;
  display:inline-flex;
  align-items:center;
  padding:0 8px;
  font-size:8px;
}

.order-toolbar{
  gap:8px;
}

.order-toolbar-button{
  min-height:42px;
  border-radius:13px;
  font-size:10px;
}

.order-detail-card{
  padding:15px;
}

.order-detail-head small,
.detail-label{
  font-size:9px;
}

.order-detail-head h2{
  font-size:17px;
}

.order-detail-item strong{
  font-size:12px !important;
}

.order-detail-item small{
  font-size:9px !important;
}

.order-process-card{
  padding:14px;
}

.order-progress .progress-item strong{
  font-size:11px;
}

.order-progress .progress-item small{
  font-size:9px;
}

#nextOrderStatusButton,
#cancelOrderButton{
  min-height:48px;
  border-radius:14px;
  font-size:11px;
  font-weight:800;
}

.order-buyer-note-card{
  border-radius:16px;
}

/* Shipping */
#shipping{
  padding-top:max(16px,env(safe-area-inset-top));
}

.shipping-heading{
  margin-top:20px;
}

.shipping-heading small{
  font-size:9px;
}

.shipping-heading h2{
  font-size:18px;
}

#shippingQueueList,
#shippingHistoryList{
  gap:10px;
}

.shipping-card,
.shipping-history-card{
  padding:14px;
}

.shipping-card-head small,
.shipping-history-card small{
  font-size:9px;
}

.shipping-card-head h3,
.shipping-history-card h3{
  font-size:14px;
}

.shipping-card-head p,
.shipping-history-card p{
  font-size:10px;
}

.shipping-meta-grid small{
  font-size:8px;
}

.shipping-meta-grid strong{
  font-size:11px;
}

.shipping-payment-notice{
  font-size:9.5px;
}

.shipping-card-footer .mini-action,
.mini-action{
  min-height:40px;
  border-radius:12px;
  font-size:10px;
}

/* Customers */
.customers-summary{
  gap:8px;
}

.customers-summary>div{
  min-height:68px;
  padding:11px;
}

.customers-summary small{
  font-size:8px;
}

.customers-summary strong,
.customers-summary>div:last-child strong{
  font-size:13px;
}

.customer-list{
  gap:9px;
}

.customer-card{
  padding:12px;
}

.customer-avatar{
  width:44px;
  height:44px;
  flex-basis:44px;
  font-size:13px;
}

.customer-card-head strong{
  font-size:12px;
}

.customer-card-head small,
.customer-location,
.customer-last-order{
  font-size:9px;
}

.customer-repeat-badge{
  font-size:8px;
}

.customer-stats small{
  font-size:7.5px;
}

.customer-stats strong{
  font-size:10px;
}

/* Business / Me */
#business .page-header,
#business .mobile-page-header{
  margin-bottom:14px;
}

.business-profile{
  padding:16px;
}

.business-avatar{
  width:58px;
  height:58px;
  border-radius:18px;
}

.business-profile h2{
  font-size:18px;
}

.business-profile p{
  font-size:10px;
}

.menu{
  overflow:hidden;
  border:1px solid var(--app-line);
  border-radius:18px;
  background:var(--app-surface);
  box-shadow:var(--app-shadow);
}

.menu button{
  min-height:56px;
  padding:0 14px;
  border-radius:0;
  font-size:12px;
}

.seller-payment-card{
  padding:14px;
}

.seller-payment-head small,
.seller-payment-description{
  font-size:9px;
}

.seller-payment-head strong{
  font-size:13px;
}

/* Bottom navigation */
.bottom-nav{
  position:fixed;
  z-index:100;
  left:50%;
  bottom:0;
  width:min(100%,430px);
  height:calc(68px + env(safe-area-inset-bottom));
  transform:translateX(-50%);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  padding:
    7px
    10px
    max(7px,env(safe-area-inset-bottom));
  border-top:1px solid rgba(210,210,204,.78);
  background:rgba(250,250,248,.94);
  box-shadow:0 -8px 28px rgba(20,20,20,.055);
  backdrop-filter:blur(22px) saturate(1.3);
  -webkit-backdrop-filter:blur(22px) saturate(1.3);
}

.bottom-nav button{
  min-width:0;
  min-height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:3px;
  padding:4px 2px;
  border:0;
  border-radius:13px;
  background:transparent;
  color:#8d8d87;
  font-size:9px;
  font-weight:700;
}

.bottom-nav button>span,
.bottom-nav .nav-icon-wrap>span{
  font-size:20px;
  line-height:1;
}

.bottom-nav button.active{
  background:#efefeb;
  color:#171717;
}

.bottom-nav button.active>span{
  transform:translateY(-1px);
}

.nav-notification{
  min-width:17px;
  height:17px;
  padding:0 4px;
  border:2px solid #fafaf8;
  font-size:8px;
}

/* All modal/sheet surfaces behave as mobile bottom sheets */
.overlay{
  position:fixed;
  z-index:180;
  inset:0;
  align-items:flex-end;
  justify-content:center;
  padding:0;
  background:rgba(20,20,20,.38);
  backdrop-filter:blur(3px);
  -webkit-backdrop-filter:blur(3px);
}

.overlay.show{
  display:flex;
}

.sheet,
.product-sheet,
.purchase-sheet,
.purchase-detail-sheet,
.shipping-sheet,
.store-settings-sheet,
.trip-settings-sheet,
.product-trip-picker-sheet,
.order-filter-sheet,
.seller-notification-sheet,
.reject-payment-sheet,
.confirm-payment-sheet{
  width:min(100%,430px);
  max-width:430px !important;
  max-height:min(88dvh,760px);
  overflow:auto;
  margin:0;
  padding:
    18px
    16px
    calc(18px + env(safe-area-inset-bottom));
  border:0;
  border-radius:24px 24px 0 0;
  background:#fff;
  box-shadow:var(--app-shadow-sheet);
  overscroll-behavior:contain;
}

.sheet::before,
.product-sheet::before,
.purchase-sheet::before,
.purchase-detail-sheet::before,
.shipping-sheet::before,
.store-settings-sheet::before,
.trip-settings-sheet::before,
.product-trip-picker-sheet::before,
.order-filter-sheet::before,
.seller-notification-sheet::before,
.reject-payment-sheet::before,
.confirm-payment-sheet::before{
  content:"";
  width:36px;
  height:4px;
  display:block;
  margin:-7px auto 13px;
  border-radius:999px;
  background:#d7d7d1;
}

.sheet-title{
  position:sticky;
  z-index:2;
  top:-18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:
    0
    -2px
    16px;
  padding:
    4px
    2px
    10px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.sheet-title small{
  font-size:9px;
}

.sheet-title h2{
  margin:0;
  font-size:18px;
}

.sheet-title>button{
  width:40px;
  height:40px;
  min-height:40px;
  flex:0 0 40px;
  padding:0;
  border:0;
  border-radius:13px;
  background:#f1f1ed;
  color:#555;
  font-size:21px;
}

.sheet .primary,
.sheet .cancel,
.product-sheet .primary,
.product-sheet .cancel,
.purchase-sheet .primary,
.purchase-sheet .cancel,
.shipping-sheet .primary,
.shipping-sheet .cancel,
.store-settings-sheet .primary,
.store-settings-sheet .cancel,
.trip-settings-sheet .primary,
.trip-settings-sheet .cancel,
.confirm-payment-button,
.reject-payment-button,
.reject-confirm-button{
  width:100%;
  min-height:48px;
  border-radius:14px;
  font-size:11px;
  font-weight:800;
}

.primary,
.confirm-payment-button{
  border:0;
  background:#171717;
  color:#fff;
}

.cancel{
  border:1px solid var(--app-line);
  background:#fff;
  color:#51514c;
}

.form-row{
  gap:8px;
}

.photo-upload,
.purchase-receipt-upload{
  min-height:150px;
  border-radius:17px;
}

/* Proof viewers become true full-screen app viewers */
.proof-viewer{
  z-index:240;
  inset:0;
  width:100%;
  max-width:none;
  height:100dvh;
  background:#111;
}

.proof-viewer-top,
.proof-viewer-header{
  min-height:58px;
  padding:
    max(10px,env(safe-area-inset-top))
    14px
    10px;
}

.proof-viewer-top button,
.proof-viewer-header button{
  width:42px;
  height:42px;
  min-height:42px;
  border-radius:14px;
}

.proof-viewer img,
.proof-viewer-body img{
  max-width:100%;
  max-height:calc(100dvh - 80px);
  object-fit:contain;
}

/* Auth */
.seller-auth,
.seller-onboarding{
  background:var(--app-bg);
}

.seller-auth-shell,
.seller-onboarding-shell{
  width:min(100%,430px);
  padding-left:18px;
  padding-right:18px;
  background:var(--app-bg);
}

.seller-auth-hero{
  margin-top:min(9vh,70px);
}

.seller-auth-logo{
  width:56px;
  height:56px;
  border-radius:18px;
}

.seller-auth-hero small,
.seller-onboarding-step>small{
  font-size:9px;
}

.seller-auth-hero h1,
.seller-onboarding-step h1{
  font-size:29px;
}

.seller-auth-hero p,
.seller-onboarding-step>p{
  font-size:12px;
}

.seller-auth-tabs{
  border-radius:15px;
}

.seller-auth-tabs button{
  min-height:42px;
  font-size:11px;
}

.seller-auth-form label,
.seller-onboarding-step label{
  font-size:11px;
}

.seller-auth-form input,
.seller-onboarding-step input,
.seller-onboarding-step select{
  min-height:50px;
  font-size:16px;
}

.seller-auth-password button{
  min-height:36px;
  font-size:9px;
}

.seller-auth-message{
  font-size:10px;
}

.seller-auth-submit,
.seller-onboarding-primary,
.seller-onboarding-secondary,
.seller-onboarding-actions>button{
  min-height:50px;
  font-size:11px;
}

.seller-auth-foot small{
  font-size:8px;
}

.seller-onboarding-summary small{
  font-size:8px;
}

.seller-onboarding-summary strong{
  font-size:11px;
}

/* Empty states */
.empty,
.trip-mobile-empty,
.customer-empty{
  padding:30px 18px;
  border-radius:18px;
}

.empty h3,
.trip-mobile-empty h3,
.customer-empty h3{
  font-size:14px;
}

.empty p,
.trip-mobile-empty p,
.customer-empty p{
  font-size:10px;
}

/* Toast */
#toast.toast{
  position:fixed !important;
  z-index:320 !important;
  top:auto !important;
  right:auto !important;
  bottom:calc(82px + env(safe-area-inset-bottom)) !important;
  left:50% !important;
  inset:auto auto calc(82px + env(safe-area-inset-bottom)) 50% !important;
  display:block !important;
  width:auto !important;
  min-width:0 !important;
  max-width:min(360px,calc(100vw - 28px)) !important;
  height:auto !important;
  min-height:0 !important;
  max-height:120px !important;
  margin:0 !important;
  padding:11px 14px !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:14px !important;
  background:#171717 !important;
  color:#fff !important;
  font-size:11px !important;
  font-weight:600 !important;
  line-height:1.4 !important;
  text-align:center !important;
  white-space:normal !important;
  word-break:break-word !important;
  box-shadow:0 10px 30px rgba(0,0,0,.16) !important;
  opacity:0;
  pointer-events:none;
  transform:translate(-50%,18px) !important;
  transition:opacity .2s ease,transform .2s ease !important;
}

#toast.toast.show{
  opacity:1 !important;
  transform:translate(-50%,0) !important;
}

/* Hide legacy Arrival UI from seller flow completely */
#tripArrival,
button[onclick*="tripArrival"],
#arrivalModal,
#arrivalDetailModal,
#arrivalPhotoViewer{
  display:none !important;
}

/* Compact phone support */
@media(max-width:360px){
  .screen,
  #home.home-screen,
  #trips.trips-screen,
  #orders.orders-screen,
  #tripDetail.trip-detail-screen,
  #customers.customers-screen{
    padding-left:12px;
    padding-right:12px;
  }

  .home-topbar,
  .mobile-page-header,
  .trip-detail-topbar,
  .customers-header,
  .back-header{
    margin-left:-12px;
    margin-right:-12px;
    padding-left:12px;
    padding-right:12px;
  }

  .home-kpi-grid{
    grid-template-columns:1.2fr .8fr .8fr;
    gap:6px;
  }

  .home-kpi-card{
    padding:10px 8px;
  }

  .home-kpi-card strong,
  .home-kpi-card:first-child strong{
    font-size:13px;
  }

  .trip-detail-summary,
  .purchase-summary-grid{
    gap:6px;
  }

  .sheet,
  .product-sheet,
  .purchase-sheet,
  .purchase-detail-sheet,
  .shipping-sheet,
  .store-settings-sheet,
  .trip-settings-sheet,
  .product-trip-picker-sheet,
  .order-filter-sheet,
  .seller-notification-sheet,
  .reject-payment-sheet,
  .confirm-payment-sheet{
    padding-left:14px;
    padding-right:14px;
  }
}

/* Desktop preview keeps the exact phone-app shell instead of stretching. */
@media(min-width:431px){
  .app{
    min-height:100dvh;
  }

  .bottom-nav{
    border-left:1px solid rgba(210,210,204,.65);
    border-right:1px solid rgba(210,210,204,.65);
  }

  .seller-auth,
  .seller-onboarding{
    background:#d9d9d5;
  }

  .seller-auth-shell,
  .seller-onboarding-shell{
    background:var(--app-bg);
    box-shadow:0 0 40px rgba(0,0,0,.055);
  }
}



/* V6.35 destructive actions */
.product-delete-button,
.danger-action{
  width:100%;
  min-height:54px;
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:0 16px;
  border:1px solid #e6bcbc;
  border-radius:16px;
  background:#fff;
  color:#b33a3a;
  box-shadow:0 2px 8px rgba(179,58,58,.05);
  font-size:11px;
  font-weight:850;
  text-align:center;
  transition:
    background .16s ease,
    border-color .16s ease,
    transform .08s ease,
    box-shadow .16s ease;
}

.product-delete-button{
  flex-direction:column;
  gap:2px;
  padding-top:10px;
  padding-bottom:10px;
}

.product-delete-button::before,
.danger-action::before{
  content:"";
  width:18px;
  height:18px;
  flex:0 0 18px;
  border-radius:6px;
  background:
    linear-gradient(#b33a3a,#b33a3a) center 5px/8px 1.5px no-repeat,
    linear-gradient(#b33a3a,#b33a3a) center 9px/8px 1.5px no-repeat,
    linear-gradient(#b33a3a,#b33a3a) center 13px/8px 1.5px no-repeat,
    linear-gradient(#fff,#fff);
  box-shadow:inset 0 0 0 1.3px #b33a3a;
}

.product-delete-button::before{
  margin-bottom:3px;
}

.product-delete-button span{
  display:block;
  color:#b33a3a;
  font-size:11px;
  font-weight:850;
  line-height:1.2;
}

.product-delete-button small{
  display:block;
  margin:0;
  color:#a77878;
  font-size:8.5px;
  font-weight:650;
  line-height:1.35;
}

.product-delete-button:hover,
.danger-action:hover{
  border-color:#dc9f9f;
  background:#fff8f8;
  box-shadow:0 4px 12px rgba(179,58,58,.08);
}

.product-delete-button:active,
.danger-action:active{
  transform:scale(.992);
  background:#fff1f1;
  border-color:#d98f8f;
}

.product-delete-button:disabled,
.danger-action:disabled{
  opacity:.5;
  transform:none;
  box-shadow:none;
}

/* Keep destructive actions visually separated from primary actions */
.trip-settings-sheet .danger-action{
  margin-top:14px;
  margin-bottom:2px;
}

.trip-settings-sheet .danger-action + .cancel{
  margin-top:8px;
}

.product-detail-v2 .product-delete-button{
  margin-top:12px;
}


/* V6.35.2 PRODUCT PRICING MOBILE POLISH */
.product-price-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:12px;
  align-items:start;
  margin-top:14px;
}

.product-form-field{
  min-width:0;
}

.product-form-field label{
  display:block;
  margin:0 0 7px;
}

#productCurrency,
#originalPrice,
#exchangeRate{
  width:100%;
  min-width:0;
}

#productCurrency{
  padding-right:36px;
  font-size:15px;
  text-overflow:ellipsis;
}

.product-rate-card{
  margin-top:10px;
  padding:12px 14px;
  border:1px solid var(--app-line);
  border-radius:14px;
  background:#f8f8f5;
  box-shadow:none;
}

.product-rate-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:7px 0;
  border-top:1px solid #ecece7;
}

.product-rate-row:first-child{
  padding-top:0;
  border-top:0;
}

.product-rate-row:last-child{
  padding-bottom:0;
}

.product-rate-row small{
  flex:0 0 88px;
  margin:1px 0 0;
  color:#92928b;
  font-size:9px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.product-rate-row strong{
  min-width:0;
  flex:1;
  margin:0;
  color:#171717;
  font-size:12px;
  font-weight:800;
  line-height:1.35;
  text-align:right;
  word-break:break-word;
}

.product-rate-source strong{
  color:#6f6f68;
  font-size:10px;
  font-weight:700;
}

.product-exchange-field{
  margin-top:14px;
}

.product-exchange-field input{
  font-size:15px;
}

.product-sheet .markup-options{
  gap:8px;
  margin-top:8px;
}

.product-sheet .markup-options button{
  min-height:44px;
  padding:0 8px;
  border-radius:13px;
  font-size:10px;
}

.product-sheet .price-calculator{
  margin-top:16px;
  border-radius:16px;
  background:#fff;
}

.product-sheet .price-calculator>div{
  min-height:45px;
  align-items:center;
  padding:11px 13px;
}

.product-sheet .price-calculator span{
  font-size:10px;
}

.product-sheet .price-calculator strong{
  font-size:12px;
}

.product-sheet .price-calculator .total{
  min-height:54px;
}

.product-sheet .price-calculator .total strong{
  font-size:15px;
}

@media(max-width:360px){
  .product-price-grid{
    grid-template-columns:1fr;
    gap:12px;
  }

  .product-rate-row{
    gap:10px;
  }

  .product-rate-row small{
    flex-basis:82px;
  }
}


/* =====================================================
   V6.36 SELLER FLOATING ACTION BUTTON
===================================================== */

.seller-fab-wrap{
  position:fixed;
  z-index:135;
  right:max(16px,calc((100vw - 430px)/2 + 16px));
  bottom:calc(82px + env(safe-area-inset-bottom));
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:10px;
  pointer-events:none;
}

.seller-fab-menu{
  width:max-content;
  max-width:min(280px,calc(100vw - 28px));
  display:flex;
  flex-direction:column;
  gap:8px;
  pointer-events:auto;
}

.seller-fab-menu.hidden{
  display:none !important;
}

.seller-fab-action{
  min-width:218px;
  min-height:54px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:9px 12px;
  border:1px solid #e4e4df;
  border-radius:16px;
  background:rgba(255,255,255,.98);
  color:#171717;
  box-shadow:0 10px 28px rgba(0,0,0,.10);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  text-align:left;
}

.seller-fab-action-icon{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#f1f1ed;
  font-size:17px;
}

.seller-fab-action-copy{
  min-width:0;
  flex:1;
}

.seller-fab-action-copy strong{
  display:block;
  margin-bottom:2px;
  font-size:12px;
  font-weight:850;
}

.seller-fab-action-copy small{
  display:block;
  color:#8c8c85;
  font-size:9px;
  line-height:1.35;
}

.seller-fab-main{
  width:58px;
  height:58px;
  min-height:58px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:#171717;
  color:#fff;
  box-shadow:0 12px 28px rgba(0,0,0,.22);
  pointer-events:auto;
  transition:transform .16s ease,background .16s ease;
}

.seller-fab-main span{
  display:block;
  font-size:29px;
  font-weight:500;
  line-height:1;
  transform:translateY(-1px);
  transition:transform .16s ease;
}

.seller-fab-wrap.open .seller-fab-main span{
  transform:rotate(45deg);
}

.seller-fab-main:active{
  transform:scale(.96);
}

.seller-auth:not(.hidden) ~ .seller-fab-wrap,
.seller-onboarding:not(.hidden) ~ .seller-fab-wrap{
  display:none;
}

@media(max-width:430px){
  .seller-fab-wrap{
    right:16px;
  }
}

@media(max-width:360px){
  .seller-fab-wrap{
    right:12px;
    bottom:calc(80px + env(safe-area-inset-bottom));
  }

  .seller-fab-main{
    width:54px;
    height:54px;
    min-height:54px;
  }

  .seller-fab-action{
    min-width:205px;
  }
}


/* V6.36.1 contextual FAB positioning */
#tripDetail.active ~ .seller-fab-wrap{
  bottom:calc(24px + env(safe-area-inset-bottom));
}

.trips-screen .mobile-page-header{
  padding-right:16px;
}

.trip-tab-section-head{
  align-items:flex-end;
}


/* V6.36.2 order card status placement */
#globalOrders .order-card{
  position:relative;
}

#globalOrders .order-card-head{
  position:relative;
  display:block;
  min-height:42px;
}

#globalOrders .order-card-customer{
  padding-right:118px;
}

#globalOrders .order-card-status-wrap{
  position:absolute;
  top:0;
  right:0;
  display:flex;
  align-items:center;
  gap:6px;
  margin:0;
}

#globalOrders .order-status{
  margin:0;
}

#globalOrders .order-card-chevron{
  margin-top:-1px;
}

@media(max-width:360px){
  #globalOrders .order-card-customer{
    padding-right:104px;
  }
}


/* V6.36.3 minimalist trip detail header actions */
#tripDetail .trip-detail-topbar{
  grid-template-columns:32px 1fr 32px;
  gap:8px;
  min-height:52px;
  padding-top:10px;
  padding-bottom:8px;
}

#tripDetail .trip-detail-back,
#tripDetail .trip-detail-more{
  width:32px;
  height:32px;
  min-height:32px;
  flex:0 0 32px;
  border:0;
  border-radius:10px;
  background:transparent;
  box-shadow:none;
  color:#55554f;
}

#tripDetail .trip-detail-back{
  font-size:24px;
  font-weight:500;
  transform:translateY(-1px);
}

#tripDetail .trip-detail-more{
  font-size:16px;
  letter-spacing:1.5px;
}

#tripDetail .trip-detail-back:active,
#tripDetail .trip-detail-more:active{
  background:rgba(0,0,0,.055);
}

#tripDetail .trip-detail-topbar small{
  margin-bottom:0;
  font-size:8px;
}

#tripDetail .trip-detail-topbar strong{
  font-size:14px;
}


/* V6.36.4 unify all back buttons with app headers */
.back-header>button,
.customers-header>button,
#productDetail .back-header>button,
#orderDetail .back-header>button,
#shipping .back-header>button{
  width:32px !important;
  height:32px !important;
  min-height:32px !important;
  flex:0 0 32px !important;
  display:grid !important;
  place-items:center !important;
  padding:0 !important;
  border:0 !important;
  border-radius:10px !important;
  background:transparent !important;
  color:#55554f !important;
  box-shadow:none !important;
  font-size:23px !important;
  font-weight:500 !important;
  line-height:1 !important;
}

.back-header>button:active,
.customers-header>button:active,
#productDetail .back-header>button:active,
#orderDetail .back-header>button:active,
#shipping .back-header>button:active{
  background:rgba(0,0,0,.055) !important;
}

.back-header,
.customers-header{
  gap:8px;
}

.back-header>div,
.customers-header>div{
  min-width:0;
  flex:1;
}


/* =====================================================
   V6.37 BUSINESS SETTINGS
===================================================== */

.business-setup-sheet{
  padding-bottom:max(24px,env(safe-area-inset-bottom));
}

.business-setup-sheet .sheet-title{
  align-items:center;
}

.business-setup-sheet .sheet-title>div{
  min-width:0;
}

.business-setup-sheet .sheet-title small{
  display:block;
  margin-bottom:3px;
  color:#92928b;
  font-size:9px;
  font-weight:850;
  letter-spacing:.05em;
}

.business-setup-intro{
  margin:12px 0 16px;
  color:#777771;
  font-size:10px;
  line-height:1.5;
}

.business-setup-block{
  margin-top:12px;
  padding:14px;
  border:1px solid #e4e4de;
  border-radius:18px;
  background:#fafaf8;
}

.business-setup-block>small{
  display:block;
  margin-bottom:10px;
  color:#8d8d86;
  font-size:8px;
  font-weight:850;
  letter-spacing:.06em;
}

.business-setup-block label{
  display:block;
  margin:12px 0 7px;
}

.business-setup-block label:first-of-type{
  margin-top:0;
}

.business-setup-block p{
  margin:8px 0 2px;
  color:#8b8b84;
  font-size:9px;
  line-height:1.45;
}


/* =====================================================
   V6.38 CUSTOM FORM PICKERS
===================================================== */

.custom-picker-overlay{
  z-index:360;
}

.custom-picker-sheet{
  max-height:min(82dvh,720px);
  padding-bottom:max(18px,env(safe-area-inset-bottom));
}

.custom-picker-head{
  position:sticky;
  z-index:2;
  top:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:2px 0 12px;
  background:#fff;
}

.custom-picker-head>div{
  min-width:0;
  flex:1;
}

.custom-picker-head small{
  display:block;
  margin-bottom:3px;
  color:#92928b;
  font-size:8px;
  font-weight:850;
  letter-spacing:.06em;
}

.custom-picker-head h2{
  margin:0;
  font-size:18px;
  line-height:1.2;
}

.custom-picker-head>button{
  width:34px;
  height:34px;
  min-height:34px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:10px;
  background:#f3f3ef;
  color:#4d4d48;
  font-size:20px;
}

.custom-select-options{
  overflow:auto;
  margin:0 -14px;
  padding:0 14px 4px;
  overscroll-behavior:contain;
}

.custom-select-group{
  padding:14px 2px 7px;
  color:#999992;
  font-size:8px;
  font-weight:850;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.custom-select-option{
  width:100%;
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 13px;
  border:0;
  border-top:1px solid #eeeeea;
  background:#fff;
  color:#1c1c1a;
  text-align:left;
}

.custom-select-group + .custom-select-option{
  border-top:0;
}

.custom-select-option span{
  min-width:0;
  flex:1;
  overflow:hidden;
  font-size:13px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.custom-select-option b{
  width:24px;
  height:24px;
  flex:0 0 24px;
  display:grid;
  place-items:center;
  border:1px solid #d9d9d3;
  border-radius:50%;
  color:transparent;
  font-size:12px;
}

.custom-select-option.selected{
  background:#fafaf7;
}

.custom-select-option.selected b{
  border-color:#171717;
  background:#171717;
  color:#fff;
}

.custom-select-option:disabled{
  opacity:.42;
}

.custom-date-sheet{
  max-height:none;
}

.custom-date-nav{
  display:grid;
  grid-template-columns:38px 1fr 38px;
  align-items:center;
  gap:10px;
  margin:4px 0 10px;
}

.custom-date-nav button{
  width:38px;
  height:38px;
  min-height:38px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:11px;
  background:#f4f4f0;
  color:#2e2e2b;
  font-size:24px;
}

.custom-date-nav strong{
  text-align:center;
  font-size:14px;
  font-weight:850;
}

.custom-date-weekdays,
.custom-date-grid{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  gap:4px;
}

.custom-date-weekdays{
  margin-bottom:4px;
}

.custom-date-weekdays span{
  display:grid;
  place-items:center;
  height:28px;
  color:#96968f;
  font-size:8px;
  font-weight:850;
}

.custom-date-day{
  aspect-ratio:1/1;
  min-height:38px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#262624;
  font-size:12px;
  font-weight:700;
}

.custom-date-day.outside{
  color:#c2c2bc;
}

.custom-date-day.today{
  box-shadow:inset 0 0 0 1px #b9b9b2;
}

.custom-date-day.selected{
  background:#171717;
  color:#fff;
  box-shadow:none;
}

.custom-date-day:disabled{
  opacity:.25;
}

.custom-date-actions{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:8px;
  margin-top:14px;
}

.custom-date-actions>button{
  min-height:46px;
  border-radius:14px;
}

.custom-date-actions>button:first-child{
  border:1px solid #deded8;
  background:#fff;
  color:#55554f;
  font-size:11px;
  font-weight:800;
}

/* Native controls stay visual, but never invoke OS picker. */
select,
input[type="date"]{
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
}

input[type="date"]::-webkit-calendar-picker-indicator{
  opacity:0;
  pointer-events:none;
}


/* V6.38.1 custom select confirmation actions */
.custom-select-actions{
  position:sticky;
  bottom:0;
  display:grid;
  grid-template-columns:1fr 1.35fr;
  gap:8px;
  margin:10px -14px -2px;
  padding:10px 14px 2px;
  border-top:1px solid #ecece7;
  background:rgba(255,255,255,.98);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.custom-select-actions>button{
  min-height:46px;
  border-radius:14px;
}

.custom-select-actions>button:first-child{
  border:1px solid #deded8;
  background:#fff;
  color:#55554f;
  font-size:11px;
  font-weight:800;
}


/* V6.38.2 fix custom select scrolling on mobile */
.custom-picker-sheet{
  display:flex;
  flex-direction:column;
  max-height:min(82dvh,720px);
  overflow:hidden;
}

.custom-picker-head{
  flex:0 0 auto;
}

.custom-select-options{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto !important;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-y;
  margin:0 -14px;
  padding:0 14px 8px;
}

.custom-select-actions{
  flex:0 0 auto;
  position:sticky;
  bottom:0;
  z-index:3;
}


/* =====================================================
   V6.39 MULTI PAYMENT ACCOUNTS
===================================================== */

.business-payment-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.business-payment-head>div{
  min-width:0;
}

.business-payment-head small{
  display:block;
  margin-bottom:3px;
  color:#8d8d86;
  font-size:8px;
  font-weight:850;
  letter-spacing:.06em;
}

.business-payment-head strong{
  display:block;
  font-size:13px;
  font-weight:850;
}

.business-payment-add{
  min-height:36px;
  padding:0 11px;
  border:1px solid #deded8;
  border-radius:11px;
  background:#fff;
  color:#171717;
  font-size:9px;
  font-weight:850;
}

.business-payment-help{
  margin:8px 0 12px !important;
}

.business-payment-account-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.business-payment-empty{
  padding:14px;
  border:1px dashed #d8d8d2;
  border-radius:14px;
  background:#fff;
}

.business-payment-empty strong{
  display:block;
  margin-bottom:4px;
  font-size:11px;
}

.business-payment-empty small{
  color:#8b8b84;
  font-size:9px;
}

.business-payment-account{
  overflow:hidden;
  border:1px solid #e4e4de;
  border-radius:15px;
  background:#fff;
}

.business-payment-account-main{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  border:0;
  background:#fff;
  color:#171717;
  text-align:left;
}

.business-payment-logo{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#f1f1ed;
  font-size:13px;
  font-weight:900;
}

.business-payment-copy{
  min-width:0;
  flex:1;
}

.business-payment-copy strong{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  font-size:11px;
  font-weight:850;
}

.business-payment-copy strong em{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:0 7px;
  border-radius:999px;
  background:#eaf6ef;
  color:#2c7a55;
  font-size:7px;
  font-style:normal;
  font-weight:850;
}

.business-payment-copy small{
  display:block;
  overflow:hidden;
  margin-top:3px;
  color:#878780;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.business-payment-chevron{
  color:#aaa;
  font-size:18px;
}

.business-payment-account-actions{
  display:flex;
  justify-content:flex-end;
  gap:7px;
  padding:8px 10px;
  border-top:1px solid #eeeeea;
  background:#fafaf8;
}

.business-payment-account-actions button{
  min-height:32px;
  padding:0 10px;
  border:1px solid #deded8;
  border-radius:10px;
  background:#fff;
  color:#55554f;
  font-size:8.5px;
  font-weight:800;
}

.business-payment-account-actions button.danger{
  border-color:#edcccc;
  color:#a83b3b;
}

.payment-account-sheet{
  padding-bottom:max(22px,env(safe-area-inset-bottom));
}

.payment-default-toggle{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
  margin:16px 0;
  padding:12px;
  border:1px solid #e4e4de;
  border-radius:14px;
  background:#fafaf8;
}

.payment-default-toggle input{
  width:20px;
  height:20px;
  min-height:20px;
  flex:0 0 20px;
  margin:1px 0 0;
  accent-color:#171717;
}

.payment-default-toggle span{
  min-width:0;
  flex:1;
}

.payment-default-toggle strong{
  display:block;
  color:#171717;
  font-size:11px;
}

.payment-default-toggle small{
  display:block;
  margin-top:3px;
  color:#878780;
  font-size:9px;
  font-weight:600;
}


/* =====================================================
   V6.43 SELLER SUBSCRIPTION PAGE
===================================================== */

.business-plan-card{
  width:100%;
  display:block;
  padding:16px;
  border:1px solid #e3e3dd;
  border-radius:18px;
  background:#fff;
  color:#171717;
  text-align:left;
}

.business-plan-card>small{
  display:block;
  margin-bottom:7px;
  color:#8d8d86;
  font-size:8px;
  font-weight:850;
  letter-spacing:.07em;
}

.business-plan-card-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.business-plan-card h2{
  margin:0;
  font-size:22px;
}

.business-plan-card p{
  margin:4px 0 0;
  color:#888881;
  font-size:9px;
  line-height:1.45;
}

.business-plan-card-row>b{
  color:#aaa;
  font-size:22px;
}

.subscription-back-header{
  position:sticky;
  top:0;
  z-index:8;
  background:#f7f7f5;
}

.subscription-hero{
  margin:14px 0 20px;
  padding:18px;
  border-radius:22px;
  background:#171715;
  color:#fff;
}

.subscription-hero>small{
  display:block;
  margin-bottom:10px;
  color:#aaa9a1;
  font-size:8px;
  font-weight:850;
  letter-spacing:.08em;
}

.subscription-hero-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.subscription-hero h1{
  margin:0;
  font-size:30px;
  line-height:1;
}

.subscription-hero p{
  margin:7px 0 0;
  color:#c8c8c1;
  font-size:10px;
}

.subscription-plan-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  background:#fff;
  color:#171715;
  font-size:8px;
  font-weight:900;
  letter-spacing:.06em;
}

.subscription-renewal{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.14);
}

.subscription-renewal span{
  color:#aaa9a1;
  font-size:9px;
}

.subscription-renewal strong{
  font-size:10px;
}

.subscription-section-head{
  margin:18px 0 10px;
}

.subscription-section-head small{
  display:block;
  color:#95958e;
  font-size:8px;
  font-weight:850;
  letter-spacing:.08em;
}

.subscription-section-head h2{
  margin:4px 0 0;
  font-size:18px;
}

.subscription-usage-list{
  display:flex;
  flex-direction:column;
  gap:9px;
}

.subscription-usage-card{
  padding:13px 14px;
  border:1px solid #e3e3dd;
  border-radius:16px;
  background:#fff;
}

.subscription-usage-card.warning{
  border-color:#e4cda9;
  background:#fffaf2;
}

.subscription-usage-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.subscription-usage-head strong{
  display:block;
  font-size:11px;
}

.subscription-usage-head small{
  display:block;
  margin-top:3px;
  color:#8c8c85;
  font-size:8.5px;
}

.subscription-usage-head>span{
  color:#777770;
  font-size:9px;
  white-space:nowrap;
}

.subscription-usage-head>span b{
  color:#171715;
  font-size:12px;
}

.subscription-progress{
  height:7px;
  overflow:hidden;
  margin-top:11px;
  border-radius:999px;
  background:#efefeb;
}

.subscription-progress i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:#171715;
}

.subscription-unlimited{
  margin-top:10px;
  color:#686861;
  font-size:8.5px;
  font-weight:750;
}

.subscription-plan-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.subscription-plan-card{
  padding:16px;
  border:1px solid #e3e3dd;
  border-radius:19px;
  background:#fff;
}

.subscription-plan-card.current{
  border-color:#171715;
  box-shadow:0 0 0 1px #171715 inset;
}

.subscription-plan-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.subscription-plan-head small{
  display:block;
  color:#92928b;
  font-size:8px;
  font-weight:850;
  letter-spacing:.08em;
}

.subscription-plan-head h3{
  margin:4px 0 0;
  font-size:18px;
}

.subscription-plan-head>span{
  padding:6px 9px;
  border-radius:999px;
  background:#171715;
  color:#fff;
  font-size:8px;
  font-weight:850;
}

.subscription-price{
  margin:14px 0;
}

.subscription-price strong{
  font-size:23px;
}

.subscription-price small{
  margin-left:3px;
  color:#8c8c85;
  font-size:9px;
}

.subscription-plan-limits{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px 12px;
  padding:12px;
  border-radius:13px;
  background:#f7f7f4;
}

.subscription-plan-limits span{
  display:flex;
  justify-content:space-between;
  gap:8px;
  color:#73736c;
  font-size:8.5px;
}

.subscription-plan-limits b{
  color:#44443f;
  font-weight:800;
}

.subscription-plan-card ul{
  display:grid;
  gap:6px;
  margin:13px 0;
  padding:0;
  list-style:none;
  color:#5f5f59;
  font-size:9px;
}

.subscription-plan-card>button{
  width:100%;
  min-height:42px;
  border-radius:12px;
  font-size:10px;
  font-weight:850;
}

.subscription-plan-card>button.upgrade{
  border:0;
  background:#171715;
  color:#fff;
}

.subscription-plan-card>button.current{
  border:1px solid #dfdfd9;
  background:#f5f5f2;
  color:#8a8a83;
}

.subscription-annual{
  display:block;
  margin-top:8px;
  color:#92928b;
  font-size:8px;
  text-align:center;
}

.subscription-note{
  margin:16px 0 90px;
  padding:14px;
  border:1px solid #e4e4de;
  border-radius:16px;
  background:#fafaf8;
}

.subscription-note strong{
  display:block;
  font-size:10px;
}

.subscription-note p{
  margin:4px 0 0;
  color:#898982;
  font-size:8.5px;
  line-height:1.5;
}

.subscription-loading-card{
  padding:16px;
  border:1px solid #e4e4de;
  border-radius:16px;
  background:#fff;
  color:#91918a;
  font-size:9px;
}


/* =====================================================
   V6.44 MANUAL SUBSCRIPTION UPGRADE
===================================================== */

.subscription-pending-payment{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:14px 0;
  padding:14px;
  border:1px solid #e2d2aa;
  border-radius:17px;
  background:#fffaf0;
}

.subscription-pending-payment small{
  display:block;
  color:#a38a55;
  font-size:8px;
  font-weight:850;
  letter-spacing:.07em;
}

.subscription-pending-payment strong{
  display:block;
  margin-top:4px;
  font-size:11px;
}

.subscription-pending-payment span{
  display:block;
  margin-top:4px;
  color:#7e7462;
  font-size:9px;
}

.subscription-pending-payment p{
  margin:8px 0 0;
  color:#a34c4c;
  font-size:9px;
  line-height:1.4;
}

.subscription-pending-payment button{
  min-height:36px;
  padding:0 12px;
  border:0;
  border-radius:11px;
  background:#171715;
  color:#fff;
  font-size:9px;
  font-weight:850;
}

.subscription-pending-payment>b{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#171715;
  color:#fff;
  font-size:11px;
}

.subscription-upgrade-sheet{
  max-height:88dvh;
  overflow:auto;
}

.subscription-upgrade-summary{
  margin:10px 0 18px;
  padding:14px;
  border:1px solid #e2e2dc;
  border-radius:16px;
  background:#fafaf8;
}

.subscription-upgrade-summary small{
  display:block;
  color:#92928b;
  font-size:8px;
  font-weight:850;
  letter-spacing:.07em;
}

.subscription-upgrade-summary strong{
  display:block;
  margin-top:4px;
  font-size:18px;
}

.subscription-upgrade-summary span{
  display:block;
  margin-top:5px;
  color:#7f7f78;
  font-size:8.5px;
}

.subscription-upgrade-label{
  display:block;
  margin-bottom:8px;
  color:#96968f;
  font-size:8px;
  font-weight:850;
  letter-spacing:.07em;
}

.subscription-cycle-options{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px;
}

.subscription-cycle-options button{
  min-height:64px;
  padding:11px;
  border:1px solid #e1e1db;
  border-radius:14px;
  background:#fff;
  color:#4c4c47;
  text-align:left;
}

.subscription-cycle-options button.active{
  border-color:#171715;
  background:#171715;
  color:#fff;
}

.subscription-cycle-options strong{
  display:block;
  font-size:11px;
}

.subscription-cycle-options small{
  display:block;
  margin-top:4px;
  opacity:.72;
  font-size:8.5px;
}

.subscription-transfer-card{
  margin:10px 0 14px;
  padding:16px;
  border-radius:18px;
  background:#171715;
  color:#fff;
}

.subscription-transfer-card>small{
  display:block;
  color:#aaa9a1;
  font-size:8px;
  font-weight:850;
  letter-spacing:.07em;
}

.subscription-transfer-provider{
  display:flex;
  align-items:center;
  gap:11px;
  margin-top:12px;
}

.subscription-transfer-provider>span{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#fff;
  color:#171715;
  font-size:10px;
  font-weight:900;
}

.subscription-transfer-provider strong{
  display:block;
  font-size:15px;
}

.subscription-transfer-provider small{
  display:block;
  margin-top:3px;
  color:#bdbdb5;
  font-size:9px;
}

.subscription-transfer-amount{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:15px;
  padding-top:13px;
  border-top:1px solid rgba(255,255,255,.14);
}

.subscription-transfer-amount span{
  color:#bdbdb5;
  font-size:9px;
}

.subscription-transfer-amount strong{
  font-size:16px;
}

.subscription-transfer-card p{
  margin:13px 0 0;
  color:#c6c6bf;
  font-size:8.5px;
  line-height:1.5;
}

.subscription-payment-reference{
  display:block;
  margin-top:9px;
  color:#8f8f88!important;
  font-size:7.5px!important;
}

.subscription-proof-upload{
  position:relative;
  min-height:190px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  margin-top:12px;
  border:1px dashed #cecec7;
  border-radius:16px;
  background:#fafaf8;
}

.subscription-proof-upload input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
}

.subscription-proof-upload img{
  width:100%;
  max-height:330px;
  object-fit:contain;
  display:none;
}

.subscription-proof-upload>div{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:22px;
  text-align:center;
}

.subscription-proof-upload>div span{
  font-size:26px;
}

.subscription-proof-upload>div strong{
  font-size:11px;
}

.subscription-proof-upload>div small{
  color:#92928b;
  font-size:8px;
}

#subscriptionSubmitProofButton,
#subscriptionCreatePaymentButton{
  margin-top:12px;
}


/* =====================================================
   V6.45 POLISHED SUBSCRIPTION UPGRADE
===================================================== */

.subscription-upgrade-overlay{
  align-items:flex-end;
}

.subscription-upgrade-sheet{
  width:min(100%,520px);
  max-height:92dvh;
  overflow:auto;
  padding:0 18px 20px;
  border-radius:28px 28px 0 0;
  background:#fff;
}

.subscription-upgrade-top{
  position:sticky;
  top:0;
  z-index:5;
  display:grid;
  grid-template-columns:36px 1fr 36px;
  align-items:start;
  gap:10px;
  margin:0 -18px 6px;
  padding:18px 18px 12px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px);
  border-bottom:1px solid #f0f0eb;
}

.subscription-upgrade-back,
.subscription-upgrade-close{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:12px;
  background:#f2f2ee;
  color:#33332f;
  font-size:22px;
}

.subscription-upgrade-title{
  min-width:0;
}

.subscription-upgrade-title>small{
  display:block;
  color:#999990;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.09em;
}

.subscription-upgrade-title h2{
  margin:3px 0 0;
  font-size:18px;
  line-height:1.2;
}

.subscription-upgrade-title p{
  margin:4px 0 0;
  color:#8b8b84;
  font-size:8.5px;
  line-height:1.4;
}

.subscription-stepper{
  display:grid;
  grid-template-columns:auto 1fr auto 1fr auto;
  align-items:center;
  gap:7px;
  margin:14px 2px 18px;
}

.subscription-stepper>div{
  display:flex;
  align-items:center;
  gap:5px;
  color:#aaa9a2;
}

.subscription-stepper>div span{
  width:24px;
  height:24px;
  display:grid;
  place-items:center;
  border:1px solid #dbdbd5;
  border-radius:50%;
  background:#fff;
  font-size:8px;
  font-weight:900;
}

.subscription-stepper>div small{
  font-size:7.5px;
  font-weight:800;
}

.subscription-stepper>i{
  height:1px;
  background:#e1e1dc;
}

.subscription-stepper>div.active{
  color:#171715;
}

.subscription-stepper>div.active span{
  border-color:#171715;
  background:#171715;
  color:#fff;
}

.subscription-stepper>div.complete span{
  border-color:#171715;
  background:#171715;
  color:#fff;
}

.subscription-stepper>div.complete span::before{
  content:"✓";
}

.subscription-stepper>div.complete span{
  font-size:0;
}

.subscription-stepper>div.complete span::before{
  font-size:9px;
}

.subscription-upgrade-summary{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 12px;
  padding:15px;
  border:1px solid #e3e3dd;
  border-radius:18px;
  background:#fafaf8;
}

.subscription-upgrade-summary-icon{
  width:46px;
  height:46px;
  flex:0 0 46px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#171715;
  color:#fff;
  font-size:18px;
  font-weight:900;
}

.subscription-upgrade-summary-copy{
  min-width:0;
}

.subscription-upgrade-summary-copy small{
  display:block;
  color:#989890;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.08em;
}

.subscription-upgrade-summary-copy strong{
  display:block;
  margin-top:2px;
  font-size:16px;
}

.subscription-upgrade-summary-copy span{
  display:block;
  margin-top:4px;
  color:#808079;
  font-size:8.5px;
  line-height:1.4;
}

.subscription-upgrade-benefits{
  display:grid;
  gap:7px;
  margin-bottom:18px;
}

.subscription-upgrade-benefits>div{
  display:flex;
  align-items:flex-start;
  gap:8px;
  padding:10px 11px;
  border-radius:13px;
  background:#f7f7f4;
}

.subscription-upgrade-benefits>div>span{
  width:20px;
  height:20px;
  flex:0 0 20px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#171715;
  color:#fff;
  font-size:8px;
  font-weight:900;
}

.subscription-upgrade-benefits p{
  margin:0;
}

.subscription-upgrade-benefits strong{
  display:block;
  font-size:9.5px;
}

.subscription-upgrade-benefits small{
  display:block;
  margin-top:2px;
  color:#898982;
  font-size:7.8px;
  line-height:1.4;
}

.subscription-billing-head{
  margin-bottom:8px;
}

.subscription-billing-head small{
  display:block;
  color:#999990;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.08em;
}

.subscription-billing-head strong{
  display:block;
  margin-top:3px;
  font-size:11px;
}

.subscription-cycle-options{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}

.subscription-cycle-options button{
  position:relative;
  min-height:68px;
  display:grid;
  grid-template-columns:22px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  border:1px solid #e1e1db;
  border-radius:16px;
  background:#fff;
  color:#4c4c47;
  text-align:left;
}

.subscription-cycle-options button.active{
  border-color:#171715;
  background:#fafaf8;
  color:#171715;
  box-shadow:0 0 0 1px #171715 inset;
}

.subscription-cycle-radio{
  width:20px;
  height:20px;
  border:1px solid #cfcfc9;
  border-radius:50%;
}

.subscription-cycle-options button.active .subscription-cycle-radio{
  border:6px solid #171715;
}

.subscription-cycle-options button>div strong{
  display:block;
  font-size:10px;
}

.subscription-cycle-options button>div small{
  display:block;
  margin-top:3px;
  color:#8e8e86;
  font-size:7.8px;
}

.subscription-cycle-options button>b{
  font-size:10px;
  white-space:nowrap;
}

.subscription-cycle-options button>em{
  position:absolute;
  top:-7px;
  right:10px;
  padding:3px 6px;
  border-radius:999px;
  background:#171715;
  color:#fff;
  font-size:6px;
  font-style:normal;
  font-weight:900;
  letter-spacing:.05em;
}

.subscription-checkout-summary{
  margin-top:13px;
  padding:12px 13px;
  border:1px solid #e4e4de;
  border-radius:15px;
  background:#fff;
}

.subscription-checkout-summary>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:4px 0;
}

.subscription-checkout-summary span{
  color:#8e8e86;
  font-size:8px;
}

.subscription-checkout-summary strong{
  font-size:9px;
}

.subscription-checkout-summary .total{
  margin-top:5px;
  padding-top:9px;
  border-top:1px solid #ecece7;
}

.subscription-checkout-summary .total strong{
  font-size:14px;
}

.subscription-upgrade-primary{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-radius:14px;
  font-size:10px;
  font-weight:900;
}

.subscription-upgrade-primary span{
  font-size:15px;
}

.subscription-secure-note,
.subscription-review-note{
  margin:9px 8px 0;
  color:#91918a;
  font-size:7.5px;
  line-height:1.5;
  text-align:center;
}

.subscription-payment-status-card{
  margin-bottom:12px;
  padding:13px 14px;
  border:1px solid #e2e2dc;
  border-radius:16px;
  background:#fafaf8;
}

.subscription-payment-status-card>span{
  display:block;
  color:#999990;
  font-size:7px;
  font-weight:900;
  letter-spacing:.08em;
}

.subscription-payment-status-card>strong{
  display:block;
  margin-top:3px;
  font-size:11px;
}

.subscription-payment-status-card>small{
  display:block;
  margin-top:3px;
  color:#8a8a83;
  font-size:8px;
  line-height:1.4;
}

.subscription-transfer-card{
  margin:0 0 14px;
  padding:15px;
  border-radius:18px;
  background:#171715;
  color:#fff;
}

.subscription-transfer-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.subscription-transfer-head small{
  color:#aaa9a1;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.08em;
}

.subscription-transfer-head span{
  padding:4px 7px;
  border-radius:999px;
  background:#2a2a27;
  color:#dddcd6;
  font-size:7px;
  font-weight:800;
}

.subscription-transfer-provider{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  margin-top:13px;
}

.subscription-transfer-provider>span{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#fff;
  color:#171715;
  font-size:9px;
  font-weight:900;
  overflow:hidden;
}

.subscription-transfer-provider strong{
  display:block;
  font-size:14px;
  letter-spacing:.01em;
}

.subscription-transfer-provider small{
  display:block;
  margin-top:3px;
  color:#bdbdb5;
  font-size:8px;
}

.subscription-transfer-provider button,
.subscription-transfer-amount button{
  min-height:30px;
  padding:0 9px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:9px;
  background:#2a2a27;
  color:#fff;
  font-size:7.5px;
  font-weight:850;
}

.subscription-transfer-amount{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:4px 10px;
  margin-top:14px;
  padding-top:13px;
  border-top:1px solid rgba(255,255,255,.12);
}

.subscription-transfer-amount span{
  color:#bdbdb5;
  font-size:8px;
}

.subscription-transfer-amount strong{
  font-size:18px;
}

.subscription-transfer-amount button{
  grid-column:2;
  justify-self:end;
}

.subscription-transfer-instructions{
  margin-top:13px;
  padding:11px;
  border-radius:12px;
  background:#22221f;
}

.subscription-transfer-instructions span,
.subscription-payment-reference-wrap span{
  display:block;
  color:#8f8f88;
  font-size:7px;
  font-weight:800;
}

.subscription-transfer-instructions p{
  margin:4px 0 0;
  color:#d1d1ca;
  font-size:8px;
  line-height:1.45;
}

.subscription-payment-reference-wrap{
  margin-top:10px;
}

.subscription-payment-reference-wrap strong{
  display:block;
  margin-top:3px;
  color:#bdbdb5;
  font-size:7.5px;
  font-weight:700;
  word-break:break-all;
}

.subscription-proof-section{
  margin-top:12px;
}

.subscription-proof-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:8px;
}

.subscription-proof-head small{
  display:block;
  color:#999990;
  font-size:7px;
  font-weight:900;
  letter-spacing:.08em;
}

.subscription-proof-head strong{
  display:block;
  margin-top:2px;
  font-size:10px;
}

.subscription-proof-head>span{
  padding:4px 7px;
  border-radius:999px;
  background:#f0f0ec;
  color:#777770;
  font-size:7px;
  font-weight:850;
}

.subscription-proof-upload{
  min-height:178px;
  margin:0;
  border:1px dashed #cfcfc8;
  border-radius:16px;
  background:#fafaf8;
}

.subscription-proof-upload>div span{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#171715;
  color:#fff;
  font-size:18px;
}

@media(min-width:700px){
  .subscription-upgrade-overlay{
    align-items:center;
  }

  .subscription-upgrade-sheet{
    border-radius:28px;
  }
}


/* =====================================================
   V6.45.1 FIX SUBSCRIPTION UPGRADE HEADER GRID
===================================================== */

.subscription-upgrade-top{
  grid-template-columns:36px minmax(0,1fr) 36px;
}

.subscription-upgrade-back{
  grid-column:1;
  grid-row:1;
}

.subscription-upgrade-title{
  grid-column:2;
  grid-row:1;
  width:100%;
  min-width:0;
}

.subscription-upgrade-close{
  grid-column:3;
  grid-row:1;
}

.subscription-upgrade-title h2{
  max-width:none;
  white-space:normal;
  word-break:normal;
  overflow-wrap:normal;
}

.subscription-upgrade-title p{
  max-width:320px;
  white-space:normal;
  word-break:normal;
  overflow-wrap:normal;
}


/* =====================================================
   V6.46 SUBSCRIPTION HISTORY
===================================================== */

.subscription-history-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
}

.subscription-history-head>span{
  color:#96968f;
  font-size:8px;
  font-weight:750;
}

.subscription-history-list{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.subscription-history-card{
  width:100%;
  min-height:72px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  border:1px solid #e3e3dd;
  border-radius:16px;
  background:#fff;
  color:#171715;
  text-align:left;
}

.subscription-history-card:active{
  transform:scale(.995);
}

.subscription-history-icon{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#f1f1ed;
  color:#777770;
  font-size:12px;
  font-weight:900;
}

.subscription-history-icon.paid{
  background:#eaf6ef;
  color:#2f7d58;
}

.subscription-history-icon.rejected{
  background:#fff0f0;
  color:#a84949;
}

.subscription-history-icon.review{
  background:#fff6df;
  color:#9b7424;
}

.subscription-history-main{
  min-width:0;
}

.subscription-history-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.subscription-history-title-row strong{
  min-width:0;
  overflow:hidden;
  font-size:10px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.subscription-history-title-row em{
  flex:0 0 auto;
  padding:4px 7px;
  border-radius:999px;
  background:#f1f1ed;
  color:#777770;
  font-size:6.5px;
  font-style:normal;
  font-weight:900;
}

.subscription-history-title-row em.paid{
  background:#eaf6ef;
  color:#2f7d58;
}

.subscription-history-title-row em.rejected{
  background:#fff0f0;
  color:#a84949;
}

.subscription-history-title-row em.review{
  background:#fff6df;
  color:#9b7424;
}

.subscription-history-main>small{
  display:block;
  margin-top:5px;
  color:#91918a;
  font-size:7.5px;
}

.subscription-history-amount{
  min-width:72px;
  display:grid;
  justify-items:end;
  gap:5px;
}

.subscription-history-amount strong{
  font-size:9px;
}

.subscription-history-amount small{
  color:#aaa;
  font-size:15px;
}

.subscription-history-empty{
  padding:24px 18px;
  border:1px dashed #d8d8d2;
  border-radius:17px;
  background:#fafaf8;
  text-align:center;
}

.subscription-history-empty>div{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  margin:0 auto 8px;
  border-radius:12px;
  background:#f0f0ec;
  font-size:16px;
}

.subscription-history-empty strong{
  display:block;
  font-size:10px;
}

.subscription-history-empty small{
  display:block;
  margin-top:4px;
  color:#92928b;
  font-size:8px;
}

.subscription-history-sheet{
  max-height:88dvh;
  overflow:auto;
}

.subscription-history-detail-status{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:10px 0 14px;
  padding:14px;
  border-radius:16px;
  background:#171715;
  color:#fff;
}

.subscription-history-detail-status>span{
  padding:5px 8px;
  border-radius:999px;
  background:#2b2b28;
  color:#dddcd6;
  font-size:7px;
  font-weight:900;
}

.subscription-history-detail-status>span.paid{
  background:#dff3e7;
  color:#2b7451;
}

.subscription-history-detail-status>span.rejected{
  background:#f7dddd;
  color:#9b3f3f;
}

.subscription-history-detail-status>span.review{
  background:#f6e8bc;
  color:#8b6b1f;
}

.subscription-history-detail-status strong{
  font-size:18px;
}

.subscription-history-detail-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.subscription-history-detail-grid>div,
.subscription-history-reference{
  padding:11px;
  border:1px solid #e3e3dd;
  border-radius:13px;
  background:#fafaf8;
}

.subscription-history-detail-grid span,
.subscription-history-reference span{
  display:block;
  color:#92928b;
  font-size:7px;
}

.subscription-history-detail-grid strong,
.subscription-history-reference strong{
  display:block;
  margin-top:4px;
  color:#3f3f3a;
  font-size:9px;
}

.subscription-history-reference{
  margin-top:8px;
}

.subscription-history-reference strong{
  word-break:break-all;
}

.subscription-history-timeline{
  margin-top:14px;
  padding:4px 2px;
}

.subscription-history-timeline>div{
  position:relative;
  display:grid;
  grid-template-columns:18px 1fr;
  gap:9px;
  min-height:48px;
}

.subscription-history-timeline>div:not(:last-child)::after{
  content:"";
  position:absolute;
  left:8px;
  top:18px;
  bottom:0;
  width:1px;
  background:#e0e0da;
}

.subscription-history-timeline i{
  width:17px;
  height:17px;
  display:grid;
  place-items:center;
  border:1px solid #d6d6d0;
  border-radius:50%;
  background:#fff;
}

.subscription-history-timeline .done i{
  border-color:#171715;
  background:#171715;
}

.subscription-history-timeline .done i::after{
  content:"✓";
  color:#fff;
  font-size:7px;
  font-style:normal;
  font-weight:900;
}

.subscription-history-timeline span{
  padding-bottom:12px;
}

.subscription-history-timeline small{
  display:block;
  color:#989891;
  font-size:7px;
}

.subscription-history-timeline strong{
  display:block;
  margin-top:3px;
  color:#55554f;
  font-size:8.5px;
}

.subscription-history-rejection{
  margin-top:10px;
  padding:12px;
  border:1px solid #efcece;
  border-radius:13px;
  background:#fff6f6;
}

.subscription-history-rejection small{
  color:#a45b5b;
  font-size:7px;
  font-weight:900;
  letter-spacing:.06em;
}

.subscription-history-rejection p{
  margin:5px 0 0;
  color:#8d4b4b;
  font-size:8.5px;
  line-height:1.45;
}

.subscription-history-proof-badge{
  margin-top:10px;
  padding:10px 12px;
  border-radius:12px;
  background:#eef7f1;
  color:#36775a;
  font-size:8px;
  font-weight:850;
}


/* =====================================================
   V6.47 SELLER ME REFINEMENT
===================================================== */

.seller-me-screen{
  padding-bottom:110px;
}

.me-page-head{
  margin:4px 0 14px;
}

.me-page-head small{
  display:block;
  color:#9a9a93;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
}

.me-page-head h1{
  margin:4px 0 0;
  font-size:24px;
  line-height:1.1;
}

.me-profile-card{
  display:grid;
  grid-template-columns:50px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:14px;
  border:1px solid #e4e4de;
  border-radius:20px;
  background:#fff;
}

.me-profile-avatar{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:#171715;
  color:#fff;
  font-size:18px;
  font-weight:900;
}

.me-profile-copy{
  min-width:0;
}

.me-profile-copy h2{
  margin:0;
  overflow:hidden;
  font-size:16px;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.me-profile-copy small{
  display:block;
  margin-top:4px;
  overflow:hidden;
  color:#8e8e87;
  font-size:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.me-profile-plan-badge{
  padding:6px 9px;
  border-radius:999px;
  background:#f0f0ec;
  color:#55554f;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.06em;
}

.me-current-plan-card{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:10px;
  padding:13px 14px;
  border:1px solid #e4e4de;
  border-radius:18px;
  background:#171715;
  color:#fff;
  text-align:left;
}

.me-current-plan-card>div{
  min-width:0;
}

.me-current-plan-card small{
  display:block;
  color:#9b9b94;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.08em;
}

.me-current-plan-card strong{
  display:block;
  margin-top:3px;
  font-size:17px;
}

.me-current-plan-card span{
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:#b9b9b2;
  font-size:8px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.me-current-plan-card>b{
  flex:0 0 auto;
  color:#d6d6d0;
  font-size:20px;
  font-weight:500;
}

.me-section{
  margin-top:15px;
}

.me-section-label{
  margin:0 3px 7px;
  color:#9b9b94;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.09em;
}

.me-menu-card{
  overflow:hidden;
  border:1px solid #e4e4de;
  border-radius:18px;
  background:#fff;
}

.me-menu-row{
  width:100%;
  min-height:58px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:0;
  border-bottom:1px solid #efefeb;
  background:#fff;
  color:#171715;
  text-align:left;
}

.me-menu-row:last-child{
  border-bottom:0;
}

.me-menu-row:active{
  background:#fafaf7;
}

.me-menu-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#f4f4f0;
  font-size:15px;
}

.me-menu-copy{
  min-width:0;
}

.me-menu-copy strong{
  display:block;
  font-size:10px;
  line-height:1.2;
}

.me-menu-copy small{
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:#91918a;
  font-size:7.5px;
  line-height:1.3;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.me-menu-row>b{
  color:#a5a59e;
  font-size:16px;
  font-weight:500;
}

.me-menu-row-featured{
  background:#fafaf8;
}

.me-menu-row-featured .me-menu-icon{
  background:#171715;
  color:#fff;
}

.me-account-section{
  margin-bottom:10px;
}

.me-logout-row{
  color:#8d3f3f;
}

.me-logout-row .me-menu-icon{
  background:#fff1f1;
}

@media(min-width:700px){
  .seller-me-screen{
    max-width:520px;
    margin:0 auto;
  }
}


/* =====================================================
   V6.48 SELLER ACCOUNT SECURITY
===================================================== */

.seller-account-settings-sheet{
  max-height:88dvh;
  overflow:auto;
}

.seller-account-identity{
  margin-top:12px;
  padding:13px 14px;
  border:1px solid #e3e3dd;
  border-radius:15px;
  background:#fafaf8;
}

.seller-account-identity>span{
  display:block;
  color:#999990;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.08em;
}

.seller-account-identity>strong{
  display:block;
  margin-top:4px;
  overflow:hidden;
  color:#30302c;
  font-size:11px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.seller-account-identity>small{
  display:block;
  margin-top:4px;
  color:#8f8f88;
  font-size:8px;
  line-height:1.45;
}

.seller-password-card{
  margin-top:12px;
  padding:14px;
  border:1px solid #e3e3dd;
  border-radius:16px;
  background:#fff;
}

.seller-password-card>small{
  display:block;
  margin-bottom:2px;
  color:#999990;
  font-size:7.5px;
  font-weight:900;
  letter-spacing:.08em;
}

.seller-password-card label{
  margin-top:12px;
}

.seller-security-password{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:center;
}

.seller-security-password input{
  min-width:0;
}

.seller-security-password button{
  min-width:58px;
  height:42px;
  padding:0 10px;
  border:1px solid #deded8;
  border-radius:11px;
  background:#f5f5f1;
  color:#55554f;
  font-size:8px;
  font-weight:850;
}

.seller-password-message{
  margin-top:12px;
  padding:10px 11px;
  border-radius:11px;
  background:#fff1f1;
  color:#9c4141;
  font-size:8px;
  line-height:1.45;
}

.seller-password-message.success{
  background:#edf7f1;
  color:#357257;
}

.seller-password-card>.primary{
  width:100%;
  margin-top:14px;
}

.seller-security-note{
  margin-top:12px;
  padding:12px 13px;
  border-radius:14px;
  background:#f6f6f2;
}

.seller-security-note strong{
  display:block;
  font-size:9px;
}

.seller-security-note p{
  margin:4px 0 0;
  color:#85857e;
  font-size:8px;
  line-height:1.5;
}


/* =====================================================
   V6.50.1 ACCOUNT & SECURITY POLISH
   Scoped visual override for seller account sheet
===================================================== */

#sellerAccountSettingsModal .seller-account-settings-sheet{
  width:min(100%,520px);
  max-height:88dvh;
  padding:20px 20px calc(22px + env(safe-area-inset-bottom));
  border-radius:30px 30px 0 0;
  overflow-y:auto;
  background:#ffffff;
}

#sellerAccountSettingsModal .sheet-title{
  margin-bottom:18px;
  align-items:flex-start;
}

#sellerAccountSettingsModal .sheet-title>div>small{
  display:block;
  margin-bottom:5px;
  color:#9a9a93;
  font-size:11px;
  font-weight:800;
  letter-spacing:.055em;
}

#sellerAccountSettingsModal .sheet-title>div>h2{
  margin:0;
  color:#171715;
  font-size:25px;
  line-height:1.1;
  letter-spacing:-.025em;
}

#sellerAccountSettingsModal .sheet-title>button{
  width:44px;
  min-width:44px;
  height:44px;
  margin-left:14px;
  border:0;
  border-radius:15px;
  background:#f3f3ef;
  color:#55554f;
  font-size:25px;
  font-weight:400;
  line-height:1;
}

#sellerAccountSettingsModal .seller-account-identity{
  margin-top:0;
  padding:16px 17px;
  border:1px solid #e7e7e1;
  border-radius:19px;
  background:#fafaf8;
  box-shadow:none;
}

#sellerAccountSettingsModal .seller-account-identity>span{
  color:#9b9b93;
  font-size:10px;
  font-weight:850;
  letter-spacing:.07em;
}

#sellerAccountSettingsModal .seller-account-identity>strong{
  margin-top:6px;
  color:#22221f;
  font-size:16px;
  font-weight:750;
  line-height:1.25;
}

#sellerAccountSettingsModal .seller-account-identity>small{
  margin-top:5px;
  color:#94948d;
  font-size:12px;
  line-height:1.45;
}

#sellerAccountSettingsModal .seller-security-actions{
  display:grid;
  gap:10px;
  margin-top:14px;
}

#sellerAccountSettingsModal .seller-security-action{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  min-height:76px;
  display:grid;
  grid-template-columns:46px minmax(0,1fr) 24px;
  gap:13px;
  align-items:center;
  padding:13px 14px;
  border:1px solid #e7e7e1;
  border-radius:19px;
  background:#ffffff;
  color:#191917;
  text-align:left;
  font:inherit;
  box-shadow:0 1px 0 rgba(0,0,0,.015);
  transition:transform .12s ease, background .12s ease, border-color .12s ease;
}

#sellerAccountSettingsModal .seller-security-action:active{
  transform:scale(.988);
  background:#fafaf8;
  border-color:#ddddD6;
}

#sellerAccountSettingsModal .seller-security-action-icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  flex:none;
  border-radius:15px;
  background:#f3f3ef;
  color:#282825;
  font-size:17px;
  font-weight:900;
  letter-spacing:-.06em;
}

#sellerAccountSettingsModal .seller-security-action-icon-reset{
  background:#eef5f2;
  color:#3c6658;
  font-size:22px;
  font-weight:650;
  letter-spacing:0;
}

#sellerAccountSettingsModal .seller-security-action>span:nth-child(2){
  min-width:0;
  display:block;
}

#sellerAccountSettingsModal .seller-security-action strong{
  display:block;
  margin:0;
  color:#20201d;
  font-size:15px;
  font-weight:780;
  line-height:1.25;
}

#sellerAccountSettingsModal .seller-security-action small{
  display:block;
  margin-top:4px;
  color:#909089;
  font-size:11.5px;
  font-weight:500;
  line-height:1.38;
  white-space:normal;
}

#sellerAccountSettingsModal .seller-security-action>b{
  justify-self:end;
  color:#b0b0aa;
  font-size:25px;
  font-weight:400;
  line-height:1;
}

#sellerAccountSettingsModal .seller-security-note{
  position:relative;
  margin-top:14px;
  padding:13px 14px 13px 42px;
  border:0;
  border-radius:16px;
  background:#f7f7f4;
}

#sellerAccountSettingsModal .seller-security-note::before{
  content:"i";
  position:absolute;
  left:14px;
  top:14px;
  width:18px;
  height:18px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#e9e9e4;
  color:#74746d;
  font-size:11px;
  font-weight:800;
}

#sellerAccountSettingsModal .seller-security-note strong{
  color:#4b4b46;
  font-size:11px;
  font-weight:800;
}

#sellerAccountSettingsModal .seller-security-note p{
  margin:3px 0 0;
  color:#979790;
  font-size:10.5px;
  line-height:1.45;
}

/* Change password sub-panel */
#sellerAccountSettingsModal .seller-password-card{
  margin-top:14px;
  padding:16px;
  border:1px solid #e7e7e1;
  border-radius:20px;
  background:#fff;
}

#sellerAccountSettingsModal .seller-security-back{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin:0 0 14px;
  padding:0;
  border:0;
  background:transparent;
  color:#6e6e67;
  font:inherit;
  font-size:12px;
  font-weight:750;
}

#sellerAccountSettingsModal .seller-password-card>small{
  margin-bottom:12px;
  color:#9b9b93;
  font-size:10px;
}

#sellerAccountSettingsModal .seller-password-card label{
  display:block;
  margin:13px 0 7px;
  color:#51514c;
  font-size:12px;
  font-weight:720;
}

#sellerAccountSettingsModal .seller-security-password{
  display:grid;
  grid-template-columns:minmax(0,1fr) 66px;
  gap:9px;
}

#sellerAccountSettingsModal .seller-security-password input{
  width:100%;
  min-width:0;
  height:50px;
  padding:0 14px;
  border:1px solid #deded8;
  border-radius:15px;
  background:#fafaf8;
  color:#22221f;
  font-size:14px;
  outline:none;
}

#sellerAccountSettingsModal .seller-security-password input:focus{
  border-color:#aaaaa3;
  background:#fff;
  box-shadow:0 0 0 3px rgba(20,20,18,.045);
}

#sellerAccountSettingsModal .seller-security-password button{
  width:66px;
  height:50px;
  border:1px solid #deded8;
  border-radius:15px;
  background:#f5f5f1;
  color:#55554f;
  font-size:11px;
  font-weight:800;
}

#sellerAccountSettingsModal .seller-password-card>.primary{
  min-height:50px;
  margin-top:16px;
  border-radius:15px;
  font-size:14px;
  font-weight:800;
}

@media(max-width:380px){
  #sellerAccountSettingsModal .seller-account-settings-sheet{
    padding-left:16px;
    padding-right:16px;
  }

  #sellerAccountSettingsModal .seller-security-action{
    grid-template-columns:42px minmax(0,1fr) 20px;
    gap:11px;
    padding:12px;
  }

  #sellerAccountSettingsModal .seller-security-action-icon{
    width:42px;
    height:42px;
    border-radius:14px;
  }

  #sellerAccountSettingsModal .seller-security-action strong{
    font-size:14px;
  }

  #sellerAccountSettingsModal .seller-security-action small{
    font-size:10.5px;
  }
}


/* =====================================================
   V6.51 SELLER FORGOT PASSWORD
===================================================== */

.seller-auth-forgot{
  display:block;
  margin:9px 2px 2px auto;
  padding:4px 0;
  border:0;
  background:transparent;
  color:#6f6f69;
  font:inherit;
  font-size:12px;
  font-weight:750;
}

.seller-auth-forgot:active{
  opacity:.65;
}

.seller-forgot-overlay{
  position:fixed;
  inset:0;
  z-index:1200;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:0;
  background:rgba(20,20,18,.30);
  backdrop-filter:blur(8px);
}

.seller-forgot-overlay.hidden{
  display:none!important;
}

.seller-forgot-card{
  width:min(100%,520px);
  padding:22px 20px calc(22px + env(safe-area-inset-bottom));
  border-radius:30px 30px 0 0;
  background:#fff;
  box-shadow:0 -14px 45px rgba(0,0,0,.12);
}

.seller-forgot-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.seller-forgot-head small{
  display:block;
  color:#999991;
  font-size:10px;
  font-weight:850;
  letter-spacing:.07em;
}

.seller-forgot-head h2{
  margin:5px 0 0;
  color:#171715;
  font-size:24px;
  line-height:1.1;
  letter-spacing:-.025em;
}

.seller-forgot-head>button{
  width:42px;
  height:42px;
  border:0;
  border-radius:14px;
  background:#f3f3ef;
  color:#55554f;
  font-size:24px;
  line-height:1;
}

.seller-forgot-card>p{
  margin:14px 0 18px;
  color:#85857f;
  font-size:12px;
  line-height:1.55;
}

.seller-forgot-card>label{
  display:block;
  margin-bottom:7px;
  color:#50504b;
  font-size:12px;
  font-weight:750;
}

.seller-forgot-card>input{
  width:100%;
  height:52px;
  padding:0 15px;
  border:1px solid #deded8;
  border-radius:16px;
  background:#fafaf8;
  color:#22221f;
  font:inherit;
  font-size:14px;
  outline:none;
}

.seller-forgot-card>input:focus{
  border-color:#aaa9a2;
  background:#fff;
  box-shadow:0 0 0 3px rgba(20,20,18,.045);
}

.seller-forgot-message{
  margin-top:12px;
  padding:11px 12px;
  border-radius:13px;
  background:#fff1f1;
  color:#984242;
  font-size:11px;
  line-height:1.45;
}

.seller-forgot-message.success{
  background:#edf7f1;
  color:#356c54;
}

.seller-forgot-card .seller-auth-submit{
  width:100%;
  margin-top:15px;
  min-height:50px;
}

.seller-forgot-cancel{
  width:100%;
  margin-top:8px;
  padding:12px;
  border:0;
  background:transparent;
  color:#7c7c75;
  font:inherit;
  font-size:12px;
  font-weight:750;
}


/* =====================================================
   V6.55 REGISTRATION OTP
===================================================== */

.seller-otp-card{
  padding-bottom:
    calc(20px + env(safe-area-inset-bottom));
}

.seller-otp-input{
  text-align:center;
  font-size:25px!important;
  font-weight:850!important;
  letter-spacing:.24em;
  font-variant-numeric:tabular-nums;
}

.seller-otp-card .seller-forgot-cancel:disabled{
  color:#b6b6af;
  cursor:not-allowed;
}

.seller-otp-card .seller-auth-submit:disabled{
  opacity:.62;
}


/* =====================================================
   V6.57 TITIPLO BRANDING
===================================================== */

.seller-auth-logo{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  margin-bottom:22px;
  padding:7px;
  border-radius:20px;
  background:#fff;
  box-shadow:0 12px 30px rgba(14,107,255,.13);
}

.seller-auth-logo img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
}

.seller-onboarding-brand>span{
  width:38px;
  height:38px;
  padding:4px;
  border-radius:12px;
  background:#fff;
  box-shadow:0 6px 18px rgba(14,107,255,.10);
}

.seller-onboarding-brand>span img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
}

.seller-onboarding-brand>strong{
  font-size:15px;
  font-weight:900;
  letter-spacing:.02em;
  color:#123c86;
}

.home-topbar{
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
}

.home-brand-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  padding:4px;
  border-radius:12px;
  background:#fff;
  box-shadow:0 5px 16px rgba(14,107,255,.10);
}

.home-brand-icon img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
}

@media(max-width:360px){
  .home-topbar{
    grid-template-columns:34px minmax(0,1fr) auto;
    gap:8px;
  }

  .home-brand-icon{
    width:34px;
    height:34px;
  }
}


/* =====================================================
   V6.57.1 ORIGINAL TITIPLO LOGO
===================================================== */

.seller-auth-logo{
  width:92px;
  height:92px;
  padding:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.seller-auth-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
}

.seller-onboarding-brand>span{
  width:46px;
  height:46px;
  padding:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.seller-onboarding-brand>span img{
  width:100%;
  height:100%;
  object-fit:contain;
}

.home-brand-icon{
  width:44px;
  height:44px;
  padding:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.home-brand-icon img{
  width:100%;
  height:100%;
  object-fit:contain;
}


/* =====================================================
   V6.57.2 TITIPLO BRAND FIX
   Full wordmark only where it has enough room.
   Compact areas crop the original asset to the bag mark.
===================================================== */

.seller-auth-logo-full{
  width:150px;
  height:118px;
  margin:0 0 18px;
  padding:0;
  overflow:visible;
  background:transparent;
  border-radius:0;
  box-shadow:none;
}

.seller-auth-logo-full img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  object-position:center;
}

/* Original image composition:
   upper ~70% = bag mark, lower ~30% = TITIPLO wordmark.
   Crop instead of redrawing so the icon remains identical. */
.titiplo-mark-crop{
  position:relative;
  overflow:hidden;
  flex:none;
  background:transparent!important;
  box-shadow:none!important;
}

.titiplo-mark-crop img{
  position:absolute;
  width:116%;
  height:auto;
  max-width:none;
  left:50%;
  top:-3%;
  transform:translateX(-50%);
  display:block;
}

/* Hide the lower wordmark area. */
.seller-onboarding-brand .titiplo-mark-crop{
  width:42px;
  height:42px;
  padding:0;
  border-radius:11px;
}

.seller-onboarding-brand .titiplo-mark-crop img{
  width:56px;
  left:50%;
  top:-1px;
}

.home-brand-icon.titiplo-mark-crop{
  width:40px;
  height:40px;
  padding:0;
  border-radius:11px;
}

.home-brand-icon.titiplo-mark-crop img{
  width:54px;
  left:50%;
  top:-1px;
}

/* Remove old logo-card decoration inherited from earlier iterations. */
.seller-onboarding-brand>span{
  background:transparent;
  box-shadow:none;
}

.home-topbar{
  grid-template-columns:40px minmax(0,1fr) auto;
  gap:11px;
}

@media(max-width:380px){
  .seller-auth-logo-full{
    width:136px;
    height:106px;
  }

  .home-topbar{
    grid-template-columns:36px minmax(0,1fr) auto;
    gap:9px;
  }

  .home-brand-icon.titiplo-mark-crop{
    width:36px;
    height:36px;
  }

  .home-brand-icon.titiplo-mark-crop img{
    width:49px;
  }
}


/* =====================================================
   V6.57.3 FINAL TITIPLO MAPPING
===================================================== */

/* Login/Register: full official logo */
.seller-auth-logo-full{
  width:168px;
  height:auto;
  min-height:110px;
  margin:0 0 18px;
  padding:0;
  background:transparent;
  border-radius:0;
  box-shadow:none;
  overflow:visible;
}

.seller-auth-logo-full img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
}

/* Compact areas: official icon asset only */
.seller-brand-icon,
.home-brand-icon{
  position:relative;
  display:grid;
  place-items:center;
  overflow:visible;
  padding:0!important;
  background:transparent!important;
  border-radius:0!important;
  box-shadow:none!important;
}

.seller-brand-icon{
  width:42px!important;
  height:42px!important;
}

.home-brand-icon{
  width:40px!important;
  height:40px!important;
}

.seller-brand-icon img,
.home-brand-icon img{
  position:static!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  transform:none!important;
  object-fit:contain!important;
  display:block!important;
}

/* Disable the old CSS crop technique completely. */
.titiplo-mark-crop{
  overflow:visible!important;
}

.titiplo-mark-crop img{
  position:static!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  transform:none!important;
  object-fit:contain!important;
}

.home-topbar{
  grid-template-columns:40px minmax(0,1fr) auto;
  gap:11px;
}

@media(max-width:380px){
  .seller-auth-logo-full{
    width:150px;
    min-height:98px;
  }

  .seller-brand-icon{
    width:38px!important;
    height:38px!important;
  }

  .home-brand-icon{
    width:36px!important;
    height:36px!important;
  }
}


/* =====================================================
   V6.58 TITIPLO LOGO UI CLEANUP
   Use the uploaded official assets without crop/filter.
===================================================== */

.seller-auth-logo-full{
  width:min(190px,52vw)!important;
  height:auto!important;
  min-height:0!important;
  margin:0 0 18px!important;
  padding:0!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}

.seller-auth-logo-full img{
  width:100%!important;
  height:auto!important;
  max-width:100%!important;
  display:block!important;
  object-fit:contain!important;
  object-position:left center!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  opacity:1!important;
  transform:none!important;
  image-rendering:auto!important;
}

.seller-brand-icon,
.home-brand-icon{
  overflow:hidden!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

.seller-brand-icon img,
.home-brand-icon img{
  width:100%!important;
  height:100%!important;
  display:block!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  opacity:1!important;
  transform:none!important;
  image-rendering:auto!important;
}

@media(max-width:380px){
  .seller-auth-logo-full{
    width:min(176px,54vw)!important;
  }
}


/* V6.58.1 CENTER AUTH LOGO */
.seller-auth-logo-full{
  margin:0 auto 18px!important;
}

.seller-auth-logo-full img{
  margin:0 auto!important;
  object-position:center center!important;
}


/* =====================================================
   V6.59 TITIPLO BRAND ENVIRONMENT
   Official palette derived from the TITIPLO logo:
   Navy #002F71 · Royal #005DE1 · Blue #049EFA · Cyan #13D2EA
===================================================== */

:root{
  --brand-navy:#002f71;
  --brand-royal:#005de1;
  --brand-blue:#049efa;
  --brand-cyan:#13d2ea;

  --brand-ink:#0b2748;
  --brand-muted:#6f8298;
  --brand-line:#dceafa;
  --brand-soft:#eef7ff;
  --brand-soft-cyan:#edfcfe;
  --brand-surface:#ffffff;

  --bg:#f5faff;
  --card:#ffffff;
  --text:#0b2748;
  --muted:#71849a;
  --line:#dfeaf5;
  --dark:#002f71;
  --soft:#edf6ff;

  --blue:#005de1;
  --blue-bg:#eef6ff;

  --app-bg:#f5faff;
  --app-surface:#ffffff;
  --app-surface-soft:#f9fcff;
  --app-text:#0b2748;
  --app-muted:#71849a;
  --app-line:#dfeaf5;
  --app-header-bg:rgba(245,250,255,.94);
  --app-shadow:0 5px 18px rgba(0,93,225,.055);
  --app-shadow-sheet:0 -18px 50px rgba(0,47,113,.14);
}

html,
body{
  background:#e9f4ff!important;
  color:var(--brand-ink);
}

.app,
.screen,
#trips.trips-screen,
#orders.orders-screen{
  background:var(--app-bg)!important;
}

.app{
  box-shadow:0 0 0 1px rgba(0,93,225,.045);
}

/* ---------- Header / navigation ---------- */

.mobile-page-header,
#home .home-topbar,
#tripDetail .trip-detail-topbar{
  background:rgba(245,250,255,.94)!important;
  border-bottom-color:rgba(0,93,225,.10)!important;
}

.mobile-page-header small,
.home-title-block small,
.trip-detail-topbar small{
  color:#6d8fb3!important;
}

.mobile-page-header h1,
.home-title-block h1,
.trip-detail-topbar strong{
  color:var(--brand-navy)!important;
}

.mobile-header-action,
.home-avatar,
.avatar{
  background:linear-gradient(145deg,var(--brand-royal),var(--brand-blue))!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(0,93,225,.22)!important;
}

.home-notification-button{
  background:#fff!important;
  border-color:var(--brand-line)!important;
  color:var(--brand-royal)!important;
}

.bottom-nav{
  border-top-color:rgba(0,93,225,.11)!important;
  background:rgba(255,255,255,.96)!important;
  box-shadow:0 -7px 24px rgba(0,47,113,.055);
}

.bottom-nav button{
  color:#92a2b5!important;
}

.bottom-nav button.active{
  color:var(--brand-royal)!important;
}

.nav-notification{
  border-color:#fff!important;
}

/* ---------- Main surfaces ---------- */

.home-kpi-card,
.trip-storefront-card,
.trip-summary>div,
.seller-onboarding-summary,
.me-menu-card,
.seller-account-identity,
.seller-password-card{
  border-color:var(--brand-line)!important;
  background:#fff!important;
  box-shadow:0 3px 14px rgba(0,93,225,.035)!important;
}

.home-kpi-card span,
.trip-storefront-main small{
  color:#7890aa!important;
}

.home-kpi-card strong,
.trip-storefront-main h3{
  color:var(--brand-navy)!important;
}

/* ---------- Primary CTAs ---------- */

.seller-auth-submit,
.seller-onboarding-primary,
.seller-onboarding-actions>.seller-onboarding-primary,
.trip-storefront-action,
button.primary,
.primary-button{
  border-color:transparent!important;
  background:linear-gradient(135deg,var(--brand-royal),var(--brand-blue))!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(0,93,225,.18)!important;
}

.seller-auth-submit:active,
.seller-onboarding-primary:active,
.trip-storefront-action:active{
  transform:translateY(1px);
  box-shadow:0 4px 12px rgba(0,93,225,.16)!important;
}

/* ---------- Auth / onboarding ---------- */

.seller-auth,
.seller-onboarding{
  background:
    radial-gradient(circle at 92% 4%,rgba(19,210,234,.12),transparent 29%),
    radial-gradient(circle at 8% 0%,rgba(4,158,250,.10),transparent 26%),
    #f7fbff!important;
}

.seller-auth-tabs{
  background:#eaf3fc!important;
}

.seller-auth-tabs button{
  color:#71869d!important;
}

.seller-auth-tabs button.active{
  background:#fff!important;
  color:var(--brand-royal)!important;
  box-shadow:0 4px 12px rgba(0,93,225,.09)!important;
}

.seller-auth-form label,
.seller-forgot-card label{
  color:#4f6680!important;
}

.seller-auth-form input,
.seller-forgot-card>input,
.seller-security-password input{
  border-color:#d8e7f5!important;
  background:#fff!important;
  color:var(--brand-ink)!important;
}

.seller-auth-form input:focus,
.seller-forgot-card>input:focus,
.seller-security-password input:focus{
  border-color:var(--brand-blue)!important;
  box-shadow:0 0 0 3px rgba(4,158,250,.12)!important;
}

.seller-auth-password button{
  background:var(--brand-soft)!important;
  color:var(--brand-royal)!important;
}

.seller-auth-forgot{
  color:var(--brand-royal)!important;
}

.seller-auth-foot span{
  background:#dceafa!important;
}

.seller-onboarding-progress{
  background:#deedf9!important;
}

.seller-onboarding-progress span{
  background:linear-gradient(90deg,var(--brand-royal),var(--brand-cyan))!important;
}

.seller-onboarding-done-icon{
  background:linear-gradient(145deg,var(--brand-royal),var(--brand-cyan))!important;
  box-shadow:0 8px 22px rgba(0,93,225,.20)!important;
}

/* ---------- Home hero ---------- */

.home-trip-card,
.hero{
  background:
    linear-gradient(135deg,#002f71 0%,#005de1 57%,#049efa 100%)!important;
  color:#fff!important;
  box-shadow:0 12px 28px rgba(0,74,184,.20)!important;
}

.home-trip-icon{
  background:rgba(255,255,255,.13)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.10);
}

.home-trip-copy>span,
.home-trip-copy p,
.hero>small,
.hero>p,
.hero-footer small{
  color:rgba(255,255,255,.66)!important;
}

.home-trip-card-foot{
  border-top-color:rgba(255,255,255,.13)!important;
  background:rgba(0,47,113,.28)!important;
}

.home-trip-card-foot small{
  color:rgba(255,255,255,.60)!important;
}

.home-trip-card-foot button,
.hero-footer button{
  background:#fff!important;
  color:var(--brand-royal)!important;
}

/* ---------- Informational / action surfaces ---------- */

.home-attention-card{
  border-color:#cfeaf7!important;
  background:linear-gradient(135deg,#eef9ff,#edfcfe)!important;
}

.home-attention-icon,
.home-action-icon,
.trip-storefront-icon{
  background:#eaf7ff!important;
  color:var(--brand-royal)!important;
}

.home-attention-copy small{
  color:#1688bd!important;
}

.home-attention-copy strong{
  color:#064c7d!important;
}

.home-attention-copy p,
.home-attention-card>span{
  color:#5d8ca8!important;
}

.home-action-grid>button{
  border-color:var(--brand-line)!important;
  background:#fff!important;
  color:var(--brand-ink)!important;
}

.home-action-copy strong{
  color:var(--brand-navy)!important;
}

/* ---------- Tabs / filters ---------- */

.tabs,
.trip-detail-tabs.tabs{
  background:#eaf3fc!important;
}

.tabs button,
.trip-detail-tabs.tabs button{
  color:#7890aa!important;
  border-color:#dbe9f6!important;
}

.tabs button.active,
.trip-detail-tabs.tabs button.active{
  background:#fff!important;
  color:var(--brand-royal)!important;
  border-color:#bfdcf4!important;
  box-shadow:0 3px 10px rgba(0,93,225,.08)!important;
}

/* ---------- Sheets / modals ---------- */

.overlay{
  background:rgba(0,35,78,.38)!important;
}

.sheet,
.seller-forgot-card,
#sellerAccountSettingsModal .seller-account-settings-sheet{
  background:#fff!important;
}

.sheet-title small,
.purchase-detail-sheet .sheet-title small{
  color:var(--brand-royal)!important;
}

/* ---------- Links / subtle branded accents ---------- */

a,
.seller-security-back{
  color:var(--brand-royal);
}

.publish-badge.draft,
.product-status.draft{
  background:#edf5fc!important;
  color:#66839e!important;
}

/* Keep semantic warning / error / success colors intact. */


/* V6.61.3 HOME HEADER ACTION CLEANUP */
.home-top-actions{
  gap:0!important;
}

.home-notification-button{
  width:44px!important;
  height:44px!important;
  flex:0 0 44px!important;
  border:1px solid #cfe2f4!important;
  border-radius:15px!important;
  background:#ffffff!important;
  color:var(--brand-royal)!important;
  box-shadow:0 5px 16px rgba(0,93,225,.08)!important;
}

.home-notification-bell{
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  transform:none!important;
  color:var(--brand-royal)!important;
}

.home-notification-bell svg{
  width:20px;
  height:20px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.home-notification-badge{
  top:-5px!important;
  right:-5px!important;
  min-width:18px;
  height:18px;
  border:2px solid var(--app-bg)!important;
  background:linear-gradient(135deg,var(--brand-blue),var(--brand-cyan))!important;
  color:#fff!important;
}

.home-avatar{
  display:none!important;
}


/* V6.61.4 BOTTOM SHEET DISMISS UI */
/* Bottom sheets close by tapping backdrop or swiping down. */
.overlay .sheet-title>button[aria-label="Close"]{
  display:none!important;
}

.overlay .sheet{
  position:relative;
  padding-top:30px;
}

.overlay .sheet::before{
  content:"";
  position:absolute;
  top:10px;
  left:50%;
  width:42px;
  height:4px;
  border-radius:999px;
  background:#c9d0d7;
  transform:translateX(-50%);
  pointer-events:none;
}

.overlay.show{
  touch-action:pan-y;
}

.overlay.show .sheet{
  overscroll-behavior:contain;
}


/* V6.61.5 TITIPLO BOTTOM NAV ICON REFRESH */
.bottom-nav{
  border-top:1px solid rgba(0,93,225,.10)!important;
  background:rgba(255,255,255,.97)!important;
  box-shadow:0 -8px 24px rgba(0,47,113,.055)!important;
}

.bottom-nav button{
  min-height:58px;
  gap:4px!important;
  margin:0 2px;
  border-radius:18px;
  color:#95a7bb!important;
  font-size:0!important;
  font-weight:750!important;
  transition:
    background .18s ease,
    color .18s ease,
    transform .18s ease;
}

.bottom-nav button.active{
  background:linear-gradient(
    180deg,
    rgba(4,158,250,.08) 0%,
    rgba(0,93,225,.045) 100%
  )!important;
  color:var(--brand-royal)!important;
  box-shadow:
    inset 0 0 0 1px rgba(0,93,225,.055);
}

.bottom-nav button:active{
  transform:translateY(1px);
}

.bottom-nav button em{
  display:block;
  margin:0;
  color:inherit;
  font-style:normal;
  font-size:8.5px;
  font-weight:800;
  line-height:1;
  letter-spacing:.01em;
}

.bottom-nav button>span.nav-icon-wrap{
  position:relative;
  width:24px!important;
  height:24px!important;
  display:inline-grid!important;
  place-items:center!important;
  font-size:0!important;
}

.bottom-nav button .nav-icon-wrap svg{
  width:22px;
  height:22px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.bottom-nav button.active .nav-icon-wrap{
  color:var(--brand-royal)!important;
}

.nav-notification{
  position:absolute!important;
  top:-5px!important;
  right:-8px!important;
  min-width:18px!important;
  height:18px!important;
  display:grid!important;
  place-items:center!important;
  padding:0 4px!important;
  border:2px solid #fff!important;
  border-radius:999px!important;
  background:linear-gradient(
    135deg,
    var(--brand-blue),
    var(--brand-cyan)
  )!important;
  color:#fff!important;
  font-size:6.5px!important;
  font-style:normal!important;
  font-weight:850!important;
  line-height:1!important;
  box-shadow:0 4px 10px rgba(4,158,250,.25)!important;
}

@media(max-width:360px){
  .bottom-nav button{
    min-height:56px;
    margin:0 1px;
  }

  .bottom-nav button .nav-icon-wrap svg{
    width:21px;
    height:21px;
  }

  .bottom-nav button em{
    font-size:8px;
  }
}


/* V6.61.6 ME MENU ICON REFRESH */
.me-menu-icon{
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:13px!important;
  background:linear-gradient(
    145deg,
    rgba(4,158,250,.10),
    rgba(19,210,234,.08)
  )!important;
  color:var(--brand-royal)!important;
  font-size:0!important;
  box-shadow:
    inset 0 0 0 1px rgba(0,93,225,.05);
}

.me-menu-icon svg{
  width:21px;
  height:21px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.me-menu-row-featured .me-menu-icon{
  background:linear-gradient(
    145deg,
    rgba(0,93,225,.12),
    rgba(4,158,250,.12)
  )!important;
  color:var(--brand-navy)!important;
}

.me-logout-row .me-menu-icon{
  background:rgba(214,67,67,.07)!important;
  color:#b84d4d!important;
  box-shadow:
    inset 0 0 0 1px rgba(184,77,77,.05);
}

.me-menu-row> b{
  color:#9eb0c1!important;
  font-size:18px;
  font-weight:500;
}

.me-menu-row:hover .me-menu-icon,
.me-menu-row:active .me-menu-icon{
  background:linear-gradient(
    145deg,
    rgba(0,93,225,.15),
    rgba(19,210,234,.12)
  )!important;
}

@media(max-width:360px){
  .me-menu-icon{
    width:40px!important;
    height:40px!important;
    flex-basis:40px!important;
  }

  .me-menu-icon svg{
    width:20px;
    height:20px;
  }
}


/* V6.62.4 ME MINIMAL ICONS */
#business .me-menu-icon{
  width:30px!important;
  height:30px!important;
  flex:0 0 30px!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--brand-royal)!important;
}

#business .me-menu-icon svg{
  width:22px!important;
  height:22px!important;
}

#business .me-menu-row-featured .me-menu-icon{
  background:transparent!important;
  color:var(--brand-royal)!important;
  box-shadow:none!important;
}

#business .me-logout-row .me-menu-icon{
  background:transparent!important;
  box-shadow:none!important;
  color:#b84d4d!important;
}

#business .me-menu-row:hover .me-menu-icon,
#business .me-menu-row:active .me-menu-icon{
  background:transparent!important;
}


/* =====================================================
   V6.63 TITIPLO CONFIRM DIALOG
===================================================== */

.titiplo-confirm-overlay{
  position:fixed;
  inset:0;
  z-index:99999;
  display:grid;
  place-items:end center;
  padding:20px 18px max(22px,env(safe-area-inset-bottom));
  background:rgba(7,24,43,.42);
  opacity:0;
  visibility:hidden;
  transition:opacity .16s ease,visibility .16s ease;
}

.titiplo-confirm-overlay.show{
  opacity:1;
  visibility:visible;
}

.titiplo-confirm-card{
  width:min(100%,430px);
  padding:24px 22px 18px;
  border:1px solid rgba(0,93,225,.09);
  border-radius:28px;
  background:#fff;
  box-shadow:0 24px 65px rgba(0,47,113,.20);
  transform:translateY(20px);
  transition:transform .18s ease;
}

.titiplo-confirm-overlay.show .titiplo-confirm-card{
  transform:translateY(0);
}

.titiplo-confirm-icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  margin-bottom:16px;
  border-radius:15px;
  background:var(--brand-soft);
  color:var(--brand-royal);
}

.titiplo-confirm-icon.danger{
  background:#fff0f0;
  color:#c64848;
}

.titiplo-confirm-icon svg{
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.titiplo-confirm-card h3{
  margin:0 0 8px;
  color:var(--brand-navy);
  font-size:21px;
  line-height:1.2;
}

.titiplo-confirm-card p{
  margin:0;
  color:#71849a;
  font-size:14px;
  line-height:1.55;
}

.titiplo-confirm-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:22px;
}

.titiplo-confirm-actions button{
  min-height:48px;
  border-radius:15px;
  font-size:14px;
  font-weight:800;
}

.titiplo-confirm-cancel{
  border:1px solid #dce8f4;
  background:#fff;
  color:#617890;
}

.titiplo-confirm-submit{
  border:0;
  background:linear-gradient(135deg,var(--brand-royal),var(--brand-blue));
  color:#fff;
}

.titiplo-confirm-submit.danger{
  background:#c94a4a;
}

@media(min-width:700px){
  .titiplo-confirm-overlay{
    place-items:center;
  }
}


/* =====================================================
   V6.63.1 ORDER NAV BADGE ZERO FIX
   .nav-notification uses display:grid!important, so the
   generic .hidden rule needs an equally specific override.
===================================================== */

.nav-notification.hidden,
#orderNavBadge.hidden{
  display:none!important;
}


/* =====================================================
   V6.64 SUBSCRIPTION TRIP ACCESS
===================================================== */

.subscription-trip-access-card{
  padding:18px;
  border:1px solid #cfe1f3;
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff,#f8fbff);
  box-shadow:0 4px 16px rgba(0,93,225,.04);
}

.subscription-trip-access-head{
  display:flex;
  align-items:flex-start;
  gap:12px;
}

.subscription-trip-access-icon{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#eef6ff;
  color:var(--brand-royal);
}

.subscription-trip-access-icon svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.subscription-trip-access-head>div{
  min-width:0;
}

.subscription-trip-access-head small{
  display:block;
  margin-bottom:4px;
  color:#6e8eac;
  font-size:10px;
  font-weight:850;
  letter-spacing:.08em;
}

.subscription-trip-access-head strong{
  display:block;
  color:var(--brand-navy);
  font-size:16px;
}

.subscription-trip-access-head p{
  margin:5px 0 0;
  color:#71849a;
  font-size:12.5px;
  line-height:1.5;
}

.subscription-trip-access-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:16px;
}

.subscription-trip-access-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:62px;
  padding:11px 12px;
  border:1px solid #e0eaf4;
  border-radius:16px;
  background:#fff;
}

.subscription-trip-access-row>div{
  min-width:0;
}

.subscription-trip-access-row strong{
  display:block;
  overflow:hidden;
  color:var(--brand-ink);
  font-size:13.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.subscription-trip-access-row small{
  display:block;
  margin-top:3px;
  color:#8a9bad;
  font-size:10.5px;
}

.subscription-trip-access-row>span{
  flex:none;
  padding:7px 10px;
  border-radius:999px;
  background:#edf8f4;
  color:#25835f;
  font-size:11px;
  font-weight:800;
}

.subscription-trip-access-row>button{
  flex:none;
  min-height:36px;
  padding:0 12px;
  border:0;
  border-radius:11px;
  background:var(--brand-royal);
  color:#fff;
  font-size:11px;
  font-weight:800;
}

.subscription-trip-access-row.locked{
  background:#fbfcfe;
}

.trip-mobile-publish .plan-locked{
  background:#fff2e8!important;
  color:#b46228!important;
}


/* =====================================================
   V6.70 CUSTOM DOMAIN FEATURE LOCK
===================================================== */

.enterprise-domain-block.feature-locked{
  position:relative;
  opacity:.62;
  background:#f7f8fa;
}

.enterprise-domain-block.feature-locked input{
  background:#f0f2f4!important;
  color:#9aa6b2!important;
  border-color:#e0e5ea!important;
  cursor:not-allowed;
}

.enterprise-domain-block.feature-locked label,
.enterprise-domain-block.feature-locked p,
.enterprise-domain-block.feature-locked .enterprise-title strong,
.enterprise-domain-block.feature-locked .enterprise-title small{
  color:#98a3ad!important;
}

.domain-status.locked{
  background:#eceff2!important;
  color:#7d8791!important;
  border-color:#e0e4e8!important;
}