/* ===========================================
   Campus Express - Global Styles
   =========================================== */

:root {
  --ce-primary: #0f766e;
  --ce-primary-hover: #0d9488;
  --ce-accent:  #f59e0b;
  --ce-success: #10b981;
  --ce-danger:  #ef4444;
  --ce-ink:     #0f172a;
  --ce-ink-soft:#334155;
  --ce-paper:   #ffffff;
  --ce-paper-2: #f8fafc;
  --ce-line:    #e2e8f0;
  --ce-bg:      #f8fafc;
  --ce-muted:   #475569;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
html:not(.js) .ce-page-loader { display: none; }
.ce-page-loader {
  position: fixed !important;
  inset: 0;
  z-index: 3000 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100svh;
  overflow-y: auto;
  padding: clamp(1rem,4vw,2rem);
  padding-top: calc(clamp(1rem,4vw,2rem) + env(safe-area-inset-top));
  padding-right: max(clamp(1rem,4vw,2rem), env(safe-area-inset-right));
  padding-bottom: calc(clamp(1rem,4vw,2rem) + env(safe-area-inset-bottom));
  padding-left: max(clamp(1rem,4vw,2rem), env(safe-area-inset-left));
  background: linear-gradient(135deg,#f7fffd 0%,#eef8f7 48%,#fffaf0 100%);
  opacity: 1;
  visibility: visible;
  transition: opacity .28s ease, visibility .28s ease;
  overscroll-behavior: contain;
  contain: layout paint;
}
.ce-page-loader.is-hiding { opacity:0; visibility:hidden; pointer-events:none; }
.ce-loader-card { width:min(330px,calc(100vw - 2rem)); max-height:calc(100svh - 1.5rem); overflow:auto; padding:clamp(1.35rem,6vw,2rem) clamp(1rem,5vw,1.5rem) clamp(1.05rem,4vw,1.35rem); text-align:center; border:1px solid #dcefeb; border-radius:clamp(1rem,4vw,1.25rem); background:rgba(255,255,255,.92); box-shadow:0 20px 50px rgba(20,54,72,.12); }
.ce-loader-mark { display:grid; width:58px; height:58px; margin:0 auto .9rem; place-items:center; color:#fff; font-size:1.45rem; border-radius:17px; background:linear-gradient(135deg,#0f766e,#2563eb); box-shadow:0 10px 22px rgba(15,118,110,.22); animation:ce-loader-float 1.5s ease-in-out infinite; will-change:transform; transform:translateZ(0); }
.ce-loader-brand { color:#203443; font-size:clamp(.95rem,4.5vw,1.05rem); font-weight:850; letter-spacing:-.02em; }
.ce-loader-message { max-width:100%; margin-top:.28rem; color:#81909a; font-size:clamp(.66rem,3.2vw,.72rem); line-height:1.4; overflow-wrap:anywhere; }
.ce-loader-progress { position:relative; overflow:hidden; width:100%; height:5px; margin:1.25rem .25rem .75rem; border-radius:999px; background:#e5f1ef; }
.ce-loader-progress span { position:absolute; inset:0 auto 0 0; width:42%; border-radius:inherit; background:linear-gradient(90deg,#0f766e,#14b8a6,#f59e0b); animation:ce-loader-progress 1.15s ease-in-out infinite; will-change:transform; transform:translateZ(0); }
.ce-loader-hint { color:#0f766e; font-size:clamp(.58rem,2.5vw,.63rem); font-weight:750; line-height:1.35; }
@keyframes ce-loader-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-4px); } }
@keyframes ce-loader-progress { 0% { transform:translateX(-115%); } 100% { transform:translateX(280%); } }
@media (prefers-reduced-motion: reduce) { .ce-loader-mark,.ce-loader-progress span { animation:none; } .ce-loader-progress span { width:100%; } }
@media (max-width:380px) { .ce-loader-mark { width:50px; height:50px; font-size:1.2rem; border-radius:14px; } .ce-loader-progress { margin-top:1rem; } .ce-loader-hint { font-size:.58rem; } }

@media (max-height: 520px) {
  .ce-page-loader { align-items: flex-start; }
  .ce-loader-card { margin-top: max(.5rem, env(safe-area-inset-top)); padding: .8rem 1rem .75rem; border-radius: .9rem; }
  .ce-loader-mark { width: 42px; height: 42px; margin-bottom: .45rem; border-radius: 12px; font-size: 1.05rem; }
  .ce-loader-progress { height: 4px; margin-top: .75rem; margin-bottom: .5rem; }
  .ce-loader-hint { display: none; }
}

body.cx-theme {
  min-height: 100%;
  padding-top: 72px;
  background:
    radial-gradient(circle at top left, rgba(245, 158, 11, 0.05), transparent 30%),
    radial-gradient(circle at top right, rgba(15, 118, 110, 0.07), transparent 30%),
    linear-gradient(180deg, #ffffff 0%, var(--ce-bg) 100%);
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, -apple-system, sans-serif;
  color: var(--ce-ink);
}

body.cx-theme,
body.cx-theme .text-muted,
body.cx-theme .small {
  color: var(--ce-ink) !important;
}

body.cx-theme .text-muted {
  color: var(--ce-muted) !important;
}

body.cx-theme h1,
body.cx-theme h2,
body.cx-theme h3,
body.cx-theme h4,
body.cx-theme h5,
body.cx-theme h6,
body.cx-theme .display-1,
body.cx-theme .display-2,
body.cx-theme .display-3,
body.cx-theme .display-4,
body.cx-theme .display-5,
body.cx-theme .display-6,
body.cx-theme .navbar-brand {
  font-family: 'Plus Jakarta Sans', 'Space Grotesk', sans-serif;
  letter-spacing: -0.02em;
}

body.cx-theme::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(rgba(16, 24, 43, 0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16, 24, 43, 0.02) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(180deg, rgba(0,0,0,0.18), transparent 72%);
  z-index: 0;
}

body.cx-theme > * {
  position: relative;
  z-index: 1;
}

/* Navbar */
.navbar.bg-primary {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 60%, #0f766e 100%) !important;
  box-shadow: 0 10px 30px -5px rgba(15, 23, 42, 0.25) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
}

.navbar.sticky-top,
.navbar.fixed-top {
  position: fixed !important;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  z-index: 1045 !important;
}

.navbar-brand {
  letter-spacing: -0.01em;
  color: #fff !important;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}

/* Shared Leaflet map controls */
.leaflet-control-layers {
  border: 1px solid rgba(15, 23, 42, .12) !important;
  border-radius: .7rem !important;
  box-shadow: 0 8px 20px rgba(15, 23, 42, .14) !important;
  font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif;
  font-size: .72rem;
}
.leaflet-control-layers-toggle { width: 34px !important; height: 34px !important; background-size: 20px 20px !important; }
.leaflet-control-layers-expanded { padding: .55rem .65rem !important; color: var(--ce-ink); background: rgba(255,255,255,.96); }
.leaflet-control-layers label { margin: .2rem 0; }

.cx-brand-logo-badge {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: linear-gradient(135deg, #0f766e 0%, #0d9488 100%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(15, 118, 110, 0.35);
  font-size: 1.15rem;
}

.navbar .nav-link {
  font-weight: 600;
  font-size: 0.92rem;
  color: rgba(248, 250, 252, 0.85) !important;
  padding: 0.45rem 0.85rem !important;
  border-radius: 8px;
  transition: all 0.2s ease;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.12);
}
.nav-account-copy {
  display: inline-flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  line-height: 1.15;
}
.nav-account-label { display: none; }
.nav-account-item,
.nav-account-logout { min-height: 42px; }
.nav-account-item i,
.nav-account-logout i,
.nav-dashboard-item i { width: 1.1rem; text-align: center; }
.nav-account-logout:hover { color: #b42318 !important; background: #fff1f2 !important; }
.nav-dashboard-item.active { color: #fff !important; background: var(--ce-primary) !important; }
.navbar-admin-menu {
  margin-left: auto;
  margin-right: 0.35rem;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.1);
}
.navbar-admin-menu:hover,
.navbar-admin-menu:focus {
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
}

.navbar-admin-menu,
.navbar .navbar-toggler {
  -webkit-tap-highlight-color: transparent;
}

@media (max-width: 991.98px) {
  .navbar > .container-fluid {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
  }

  .navbar .navbar-brand {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .navbar-admin-menu,
  .navbar .navbar-toggler {
    flex: 0 0 auto;
    margin-top: 0;
  }

  .navbar .navbar-toggler {
    margin-left: 0.35rem;
    padding: 0.3rem 0.45rem;
  }
}

/* Collapsed header: one predictable toolbar, then a readable account menu. */
@media (max-width: 991.98px) {
  .navbar.bg-primary { padding: .5rem 0; }

  .navbar > .container-fluid {
    padding-right: .65rem !important;
    padding-left: .65rem !important;
    flex-wrap: wrap;
  }

  .navbar .navbar-brand { gap: .45rem; font-size: 1rem; }
  .navbar .navbar-brand > span:last-child { overflow: hidden; text-overflow: ellipsis; }
  .cx-brand-logo-badge { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 9px; font-size: 1rem; }

  .navbar-admin-menu,
  .navbar .navbar-toggler {
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    margin-right: 0;
    border-radius: 11px;
  }
  .navbar .navbar-toggler { margin-left: .3rem; }

  .navbar .navbar-collapse {
    flex-basis: 100%;
    width: 100%;
    margin-top: .55rem;
    padding-top: .55rem;
    border-top: 1px solid rgba(255,255,255,.12);
  }
  .navbar .navbar-collapse.show,
  .navbar .navbar-collapse.collapsing { display: block; }
  .navbar .navbar-collapse > .navbar-nav { width: 100%; margin: 0 !important; gap: .35rem !important; }
  .navbar .navbar-collapse > .navbar-nav:first-child .nav-item,
  .navbar .navbar-collapse > .navbar-nav:first-child .nav-link { width: 100%; }
  .navbar .navbar-collapse > .navbar-nav:first-child .nav-link {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    padding: .55rem .75rem !important;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.07);
  }
  .navbar .navbar-collapse > .navbar-nav:first-child .nav-dashboard-switch {
    justify-content: flex-start;
    min-height: 50px;
    padding-right: 1rem !important;
    padding-left: 1rem !important;
    font-size: .9rem;
  }
  .navbar .navbar-collapse > .navbar-nav:first-child .nav-dashboard-switch i {
    width: 1.2rem;
    margin-right: .35rem !important;
    text-align: center;
  }
  .navbar .nav-dashboard-item {
    min-height: 48px;
    padding: .7rem .85rem;
  }
  .navbar .navbar-collapse > .navbar-nav:last-child {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    margin-top: .45rem !important;
  }
  .navbar .navbar-collapse > .navbar-nav:last-child > .nav-item:first-child { justify-self: start; }
  .navbar .navbar-collapse > .navbar-nav:last-child > .nav-item:last-child { min-width: 0; }
  .navbar .navbar-collapse > .navbar-nav:last-child > .nav-item:last-child .nav-link {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    padding: .35rem .5rem !important;
    background: rgba(255,255,255,.07);
  }
  .navbar .navbar-collapse > .navbar-nav:last-child > .nav-item:last-child .nav-account-link {
    justify-content: flex-start;
    gap: .1rem;
    padding: .45rem .65rem !important;
  }
  .navbar .nav-account-label {
    display: block;
    margin-bottom: .12rem;
    color: rgba(248,250,252,.62);
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .1em;
    line-height: 1;
    text-transform: uppercase;
  }
  .navbar .nav-account-menu {
    padding: .55rem;
    border-color: rgba(15,23,42,.12);
    border-radius: 12px;
  }
  .navbar .nav-account-item,
  .navbar .nav-account-logout {
    min-height: 50px;
    padding: .72rem .85rem;
    font-size: .9rem;
  }
  .navbar .nav-account-logout { background: #fff7f7; }
  .navbar .navbar-collapse > .navbar-nav:last-child .fw-semibold {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .navbar .navbar-collapse .dropdown-menu { width: 100%; margin-top: .25rem; }
}

/* Keep both rider assignment actions visible while the request details scroll. */
@media (max-width: 575.98px) {
  .rider-assignment-modal .rider-assignment-footer {
    /* The footer is already a flex item below the scrollable modal body.
       Keeping it in normal flow prevents it from covering the last details. */
    position: relative !important;
    bottom: auto !important;
    z-index: 10;
    width: 100%;
    padding: .75rem .85rem calc(.75rem + env(safe-area-inset-bottom));
    border-top: 1px solid #dfe8ec;
    box-shadow: 0 -10px 24px rgba(15, 23, 42, .12);
  }

  .rider-assignment-modal .rider-assignment-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
    min-width: 0;
    gap: .5rem;
  }

  .rider-assignment-modal .rider-assignment-actions .btn {
    width: 100%;
    min-height: 52px;
    padding: .55rem .4rem;
    font-size: .72rem;
    line-height: 1.2;
  }
}

@media (max-width: 575.98px) {
  body.modal-open > .mobile-workspace-nav,
  body:has(#riderAssignmentModal.show) > .mobile-workspace-nav {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* Clear COR duty-period editor: each shift has its own readable fields. */
.rider-duty-form [data-schedule-list] {
  display: grid;
  gap: .65rem;
}
.rider-duty-form .duty-period-row {
  display: block !important;
  margin: 0 !important;
  padding: .75rem;
  border: 1px solid #d9e9e6;
  border-radius: .85rem;
  background: #fff;
}
.duty-period-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  margin-bottom: .65rem;
}
.duty-period-number {
  color: #164e63;
  font-size: .73rem;
  font-weight: 850;
  letter-spacing: .03em;
  text-transform: uppercase;
}
.rider-duty-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  min-height: 34px;
  padding: .35rem .55rem;
  color: #b42318;
  border: 1px solid #f0c8c4;
  border-radius: .55rem;
  background: #fff7f6;
  font-size: .68rem;
  font-weight: 800;
}
.rider-duty-remove:hover,
.rider-duty-remove:focus-visible {
  color: #fff;
  border-color: #b42318;
  background: #b42318;
}
.duty-period-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .65rem;
}
.duty-period-field {
  display: block;
  min-width: 0;
  margin: 0;
}
.duty-period-field > span {
  display: block;
  margin-bottom: .3rem;
  color: #64748b;
  font-size: .65rem;
  font-weight: 850;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.duty-period-field .rider-duty-time {
  display: block;
  width: 100% !important;
  min-width: 0;
  min-height: 46px;
  flex: 0 0 auto;
  padding: .55rem .65rem;
  color: #163247;
  border-color: #cfe0e4;
  border-radius: .65rem !important;
  background: #fbfefd;
  font-size: .92rem;
  font-weight: 750;
}
.duty-period-field .rider-duty-time:focus {
  border-color: #0f766e;
  background: #fff;
  box-shadow: 0 0 0 .18rem rgba(15,118,110,.12);
}
.duty-time-preview {
  display: block;
  min-height: 1rem;
  margin-top: .28rem;
  color: #0f766e;
  font-size: .68rem;
  font-weight: 800;
}
.rider-duty-form .rider-duty-add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 43px;
  margin-top: .8rem;
  padding: .55rem .8rem;
  border-radius: .65rem;
  font-size: .72rem;
  font-weight: 850;
}

@media (max-width: 575.98px) {
  .rider-duty-form .duty-period-row { padding: .7rem; }
  .duty-period-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .duty-period-field .rider-duty-time { min-height: 48px; font-size: .86rem; }
  .rider-duty-form .rider-duty-add { width: 100%; }
}

@media (max-width: 380px) {
  .navbar .navbar-brand { max-width: calc(100% - 94px); font-size: 1.05rem; }
  .navbar .navbar-brand > span:last-child { display: inline-block; min-width: 0; }
  .navbar-admin-menu,
  .navbar .navbar-toggler { width: 40px; min-width: 40px; height: 40px; min-height: 40px; }
  .navbar .navbar-collapse > .navbar-nav:last-child { grid-template-columns: 40px minmax(0, 1fr); }
}

/* Browse product cards */
.browse-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 1rem;
}
.browse-page-kicker {
  margin-bottom: .25rem;
  color: var(--ce-primary);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.browse-page-title {
  margin: 0;
  color: var(--ce-ink);
  font-size: clamp(1.35rem, 2.6vw, 1.8rem);
  font-weight: 800;
  letter-spacing: -.03em;
}
.browse-page-subtitle {
  margin: .3rem 0 0;
  color: var(--ce-muted);
  font-size: .86rem;
}
.browse-search .form-control {
  min-height: 44px;
  border-color: #dbe4ed;
  border-radius: .75rem;
}
.browse-search .btn {
  width: 44px;
  border-radius: .75rem;
}
.browse-product-card {
  overflow: hidden;
  border: 1px solid #e5eaf0;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 7px 20px rgba(15, 23, 42, .06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.browse-product-card:hover {
  border-color: rgba(15, 118, 110, .28);
  box-shadow: 0 12px 28px rgba(15, 23, 42, .1);
  transform: translateY(-2px);
}
.browse-product-card.is-unavailable { opacity: .78; }
.browse-product-card.is-unavailable:hover { transform: none; }
.browse-product-image,
.browse-product-placeholder {
  display: block;
  width: 100%;
  height: 170px;
  object-fit: cover;
}
.browse-product-placeholder {
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
}
.browse-product-body {
  gap: .35rem;
  padding: .9rem;
}
.browse-product-title {
  display: -webkit-box;
  min-height: 2.55em;
  margin: 0;
  color: var(--ce-ink);
  font-size: .94rem;
  font-weight: 750;
  line-height: 1.28;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.browse-product-store {
  display: block;
  overflow: hidden;
  color: var(--ce-muted);
  font-size: .74rem;
  line-height: 1.3;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.browse-product-store:hover { color: var(--ce-primary); }
.browse-product-store i { color: var(--ce-primary); }
.browse-product-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .4rem;
  margin: .15rem 0 .3rem;
}
.browse-product-price {
  color: var(--ce-primary);
  font-size: 1rem;
  font-weight: 800;
}
.browse-product-stock {
  color: var(--ce-muted);
  font-size: .7rem;
  white-space: nowrap;
}
.browse-product-stock.is-unavailable { color: var(--ce-danger); font-weight: 800; }
.browse-add-btn {
  width: 100%;
  border-radius: .65rem;
  font-weight: 700;
}
.browse-add-btn:disabled { cursor: not-allowed; opacity: .65; }
.browse-add-label-short { display: none; }

@media (max-width: 575.98px) {
  .browse-page {
    padding-right: .75rem !important;
    padding-left: .75rem !important;
  }
  .browse-page-heading { margin-bottom: .75rem; }
  .browse-page-subtitle { font-size: .76rem; }
  .browse-search .form-control { min-height: 40px; font-size: .82rem; }
  .browse-search .btn { width: 40px; }
  .browse-product-card { border-radius: .8rem; }
  .browse-product-image,
  .browse-product-placeholder { height: 116px; }
  .browse-product-placeholder i { font-size: 1.8rem !important; }
  .browse-product-body { gap: .25rem; padding: .65rem; }
  .browse-product-title { min-height: 2.45em; font-size: .78rem; }
  .browse-product-store { font-size: .64rem; }
  .browse-product-meta { display: block; margin: .2rem 0 .35rem; }
  .browse-product-price { font-size: .88rem; }
  .browse-product-stock { margin-top: .1rem; font-size: .64rem; }
  .browse-add-btn { padding: .4rem .35rem; font-size: .7rem; }
  .browse-add-label-long { display: none; }
  .browse-add-label-short { display: inline; }
}

.browse-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .8rem;
}
.browse-section-heading h2 {
  margin: 0;
  color: var(--ce-ink);
  font-size: 1.05rem;
  font-weight: 800;
}
.browse-section-heading > span {
  color: var(--ce-muted);
  font-size: .75rem;
  font-weight: 700;
}
.browse-store-card {
  display: flex;
  align-items: center;
  gap: .75rem;
  min-height: 72px;
  padding: .8rem .9rem;
  color: inherit;
  text-decoration: none;
  background: #fff;
  border: 1px solid #e5eaf0;
  border-radius: .9rem;
  box-shadow: 0 6px 18px rgba(15, 23, 42, .05);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.browse-store-card:hover {
  border-color: rgba(15, 118, 110, .35);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .09);
  transform: translateY(-2px);
}
.browse-store-icon,
.store-hero-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  color: #0f766e;
  background: #ccfbf1;
  border-radius: .75rem;
}
.browse-store-icon { width: 40px; height: 40px; font-size: 1.1rem; }
.browse-store-card-large { min-height: 92px; }
.browse-store-card-large .browse-store-icon { width: 58px; height: 58px; overflow: hidden; }
.browse-store-card-large .browse-store-icon img { width: 100%; height: 100%; object-fit: cover; }
.browse-store-copy { min-width: 0; flex: 1 1 auto; }
.browse-store-copy strong,
.browse-store-copy small,
.browse-store-copy em { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.browse-store-copy strong { color: var(--ce-ink); font-size: .88rem; }
.browse-store-copy small { margin-top: .18rem; color: var(--ce-muted); font-size: .7rem; }
.browse-store-copy em { margin-top: .2rem; color: #94a3b8; font-size: .65rem; font-style: normal; }
.browse-store-arrow { color: #94a3b8; font-size: .85rem; }
.browse-store-empty { display: flex; align-items: center; flex-direction: column; gap: .35rem; padding: 3rem 1rem; text-align: center; background: #fff; border: 1px solid #e5eaf0; border-radius: 1rem; box-shadow: 0 7px 20px rgba(15, 23, 42, .05); }
.browse-store-empty > span { display: grid; width: 58px; height: 58px; place-items: center; color: var(--ce-primary); background: #dffaf3; border-radius: 50%; font-size: 1.45rem; }
.browse-store-empty strong { margin-top: .4rem; color: var(--ce-ink); font-size: .95rem; }
.browse-store-empty small { color: var(--ce-muted); font-size: .72rem; }
.store-hero {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.15rem;
  background: linear-gradient(135deg, #effcf9, #f8fafc 65%, #fff);
  border: 1px solid #dcefe9;
  border-radius: 1.1rem;
}
.store-hero-icon { width: 58px; height: 58px; font-size: 1.55rem; }
.store-hero-copy { min-width: 0; flex: 1 1 auto; }
.store-product-count {
  flex: 0 0 auto;
  padding: .45rem .65rem;
  color: #0f766e;
  background: #dffaf3;
  border-radius: 999px;
  font-size: .7rem;
  font-weight: 800;
  white-space: nowrap;
}
.store-products-heading { margin-bottom: 1rem; }

@media (max-width: 575.98px) {
  .browse-section-heading h2 { font-size: .95rem; }
  .browse-store-card { min-height: 64px; padding: .65rem .7rem; }
  .browse-store-icon { width: 34px; height: 34px; font-size: .95rem; }
  .browse-store-card-large { min-height: 76px; }
  .browse-store-card-large .browse-store-icon { width: 48px; height: 48px; }
  .browse-store-copy strong { font-size: .78rem; }
  .browse-store-copy small { font-size: .64rem; }
  .browse-store-copy em { font-size: .6rem; }
  .store-hero { align-items: flex-start; gap: .7rem; padding: .9rem; }
  .store-hero-icon { width: 44px; height: 44px; font-size: 1.2rem; }
  .store-hero .browse-page-title { font-size: 1.15rem; }
  .store-hero .browse-page-subtitle { font-size: .7rem; line-height: 1.35; }
  .store-product-count { font-size: .62rem; }
}

.navbar .dropdown-menu {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 16px 36px -4px rgba(15, 23, 42, 0.12);
  padding: 0.5rem;
  z-index: 1050;
  background: #ffffff;
}

.navbar .dropdown-item {
  border-radius: 8px;
  font-weight: 500;
  font-size: 0.9rem;
  padding: 0.5rem 0.85rem;
  color: var(--ce-ink);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.navbar .dropdown-item:hover {
  background: #f1f5f9;
  color: var(--ce-primary);
}

.cx-avatar-circle {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: linear-gradient(135deg, #0f766e 0%, #2563eb 100%);
  color: #ffffff;
  font-weight: 700;
  font-size: 0.85rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 0.4rem;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.2);
}

/* Sidebar */
.sidebar-collapse { transition: all .2s ease; }
@media (max-width: 768px) {
  .sidebar-collapse { display: none; }
}
aside .nav-link {
  border-radius: 10px;
  font-size: 0.92rem;
  font-weight: 600;
  padding: 0.6rem 0.9rem;
  color: var(--ce-ink-soft);
  transition: all 0.15s ease;
}
aside .nav-link:hover {
  background: #f1f5f9;
  color: var(--ce-primary);
}
aside .nav-link.active {
  background: var(--ce-primary);
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(15, 118, 110, 0.25);
}
aside .nav-link i { margin-right: 8px; font-size: 1.05rem; }

/* Cards */
.card {
  border: 1px solid var(--ce-line);
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.card .card-body { padding: 1.35rem; }
.card-header {
  background: #ffffff;
  border-bottom: 1px solid var(--ce-line);
  padding: 1rem 1.35rem;
  border-top-left-radius: 18px !important;
  border-top-right-radius: 18px !important;
}
.stat-card {
  border-left: 4px solid var(--ce-primary);
}
.stat-card h6 {
  text-transform: uppercase;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: var(--ce-muted);
}
.stat-card h3 { font-weight: 700; margin: 0; color: var(--ce-ink); }

/* Dashboard layouts */
.dashboard-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.dashboard-shell {
  position: relative;
  overflow: hidden;
  border-radius: 30px;
  color: #f7f1df;
  background:
    radial-gradient(circle at top right, rgba(232, 163, 61, 0.16), transparent 24%),
    linear-gradient(135deg, var(--dash-start, #0f172a) 0%, var(--dash-mid, #1c2942) 56%, var(--dash-end, #0e7c7b) 100%);
  box-shadow: 0 28px 70px rgba(15, 23, 42, 0.18);
}

.dashboard-shell::before,
.dashboard-shell::after {
  content: '';
  position: absolute;
  border-radius: 999px;
  background: rgba(247, 241, 223, 0.08);
  pointer-events: none;
}

.dashboard-shell::before {
  width: 260px;
  height: 260px;
  top: -90px;
  right: -80px;
}

.dashboard-shell::after {
  width: 180px;
  height: 180px;
  left: -60px;
  bottom: -70px;
}

.dashboard-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.9rem;
  border-radius: 999px;
  background: rgba(232, 163, 61, 0.16);
  color: #f7f1df;
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0.2px;
}

.dashboard-lead {
  color: rgba(247, 241, 223, 0.92);
  max-width: 62ch;
}

.dashboard-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.dashboard-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.48rem 0.82rem;
  border-radius: 999px;
  background: rgba(232, 163, 61, 0.14);
  color: #f7f1df;
  font-size: 0.9rem;
}

.dashboard-panel {
  position: relative;
  z-index: 1;
  border-radius: 28px;
  background: rgba(16, 24, 43, 0.32);
  border: 1px solid rgba(247, 241, 223, 0.14);
  backdrop-filter: blur(16px);
}

.dashboard-panel .mini-note,
.dashboard-panel .text-muted,
.dashboard-panel .text-white-50 {
  color: rgba(247, 241, 223, 0.92) !important;
}
body.cx-theme .dashboard-shell .small,
body.cx-theme .dashboard-shell .text-white-50,
body.cx-theme .dashboard-panel .text-muted {
  color: rgba(247, 241, 223, 0.92) !important;
}

.dashboard-panel-icon {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(232, 163, 61, 0.14);
  color: #f7f1df;
}

.dashboard-surface {
  border: 1px solid rgba(221, 210, 173, 0.85);
  border-radius: 24px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
  background: var(--ce-paper-2);
}

.dashboard-surface .card-body {
  padding: 1.4rem;
}

.dashboard-note-card {
  border: 0;
  border-radius: 24px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
}

.dashboard-note-card .card-body {
  padding: 1.4rem;
}

.dashboard-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.dashboard-stat {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(221, 210, 173, 0.85);
  border-radius: 24px;
  background: var(--ce-paper-2);
  box-shadow: 0 16px 36px rgba(15, 23, 42, 0.08);
}

.dashboard-stat::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: var(--dash-accent, var(--ce-primary));
}

.dashboard-stat .card-body {
  padding: 1.25rem;
}

.dashboard-stat-inner {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}

.dashboard-stat-icon {
  width: 52px;
  height: 52px;
  flex: 0 0 52px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: var(--dash-icon-bg, rgba(13, 110, 253, 0.12));
  color: var(--dash-accent, var(--ce-primary));
  font-size: 1.25rem;
}

.dashboard-stat-label {
  margin-bottom: 0.25rem;
  color: var(--ce-muted);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
  font-weight: 700;
}

.dashboard-stat-value {
  margin: 0;
  color: var(--ce-ink);
  font-size: clamp(1.5rem, 2vw, 2.2rem);
  font-weight: 800;
  line-height: 1.05;
}

.dashboard-stat-copy {
  margin: 0.3rem 0 0;
  color: var(--ce-muted);
  font-size: 0.87rem;
}

.dashboard-action-grid {
  display: grid;
  gap: 1rem;
}

.dashboard-action-card {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  padding: 1.1rem 1.15rem;
  border: 1px solid rgba(221, 210, 173, 0.85);
  background: var(--ce-paper-2);
  border-radius: 22px;
  color: var(--ce-ink);
  text-decoration: none;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.dashboard-action-card:hover {
  transform: translateY(-2px);
  border-color: rgba(232, 163, 61, 0.45);
  box-shadow: 0 18px 36px rgba(15, 23, 42, 0.1);
  color: var(--ce-ink);
}

.dashboard-action-icon {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(232, 163, 61, 0.14);
  color: var(--dash-accent, var(--ce-primary));
  font-size: 1.1rem;
}

.dashboard-action-body {
  flex: 1 1 auto;
  min-width: 0;
}

.dashboard-action-title {
  margin: 0;
  font-weight: 700;
}

.dashboard-action-desc {
  margin: 0.25rem 0 0;
  color: #475569;
  font-size: 0.875rem;
}

.dashboard-action-arrow {
  margin-left: auto;
  color: #94a3b8;
  align-self: center;
  font-size: 1.05rem;
}

.dashboard-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 0.8rem;
  border-radius: 999px;
  background: #eef3ff;
  color: var(--ce-primary);
  font-size: 0.9rem;
  font-weight: 600;
}

.dashboard-pill[href]:hover,
.dashboard-pill[href]:focus-visible {
  background: #dfe8ff;
  color: var(--ce-primary-hover);
}

@media (max-width: 768px) {
  .dashboard-shell {
    border-radius: 24px;
  }

  .dashboard-stat-value {
    font-size: 1.6rem;
  }

  .dashboard-action-card {
    padding: 1rem;
  }
}

/* Application pages */
.application-page {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.application-shell {
  position: relative;
  overflow: hidden;
  border-radius: 32px;
  color: #f7f1df;
  background:
    radial-gradient(circle at top right, rgba(232, 163, 61, 0.16), transparent 24%),
    linear-gradient(135deg, var(--app-start, #0f172a) 0%, var(--app-mid, #1c2942) 56%, var(--app-end, #0e7c7b) 100%);
  box-shadow: 0 28px 70px rgba(15, 23, 42, 0.18);
}

.application-shell::before,
.application-shell::after {
  content: '';
  position: absolute;
  border-radius: 999px;
  background: rgba(247, 241, 223, 0.08);
  pointer-events: none;
}

.application-shell::before {
  width: 240px;
  height: 240px;
  top: -100px;
  right: -70px;
}

.application-shell::after {
  width: 180px;
  height: 180px;
  left: -50px;
  bottom: -80px;
}

.application-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.9rem;
  border-radius: 999px;
  background: rgba(232, 163, 61, 0.16);
  color: #f7f1df;
  font-size: 0.92rem;
  font-weight: 600;
  letter-spacing: 0.2px;
}

.application-lead {
  color: rgba(247, 241, 223, 0.78);
  max-width: 62ch;
}

.application-stepper {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.application-step {
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
  padding: 0.95rem 1rem;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(247, 241, 223, 0.12);
}

.application-step-number {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(232, 163, 61, 0.16);
  color: #f7f1df;
  font-weight: 800;
}

.application-step-title {
  font-weight: 700;
  margin-bottom: 0.15rem;
}

.application-step-copy {
  font-size: 0.86rem;
  color: rgba(247, 241, 223, 0.75);
}

.application-form-card,
.application-note-card,
.application-status-card {
  border: 1px solid rgba(221, 210, 173, 0.85);
  border-radius: 24px;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.08);
  background: var(--ce-paper-2);
}

.application-form-card .card-body,
.application-note-card .card-body,
.application-status-card .card-body {
  padding: 1.4rem;
}

.application-section-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.application-upload-grid {
  display: grid;
  gap: 1rem;
}

.application-upload-card {
  border: 1px dashed rgba(221, 210, 173, 0.95);
  border-radius: 22px;
  background: linear-gradient(180deg, #fffdf8 0%, #f8f0d9 100%);
  padding: 1rem;
}

.application-upload-meta {
  color: var(--ce-muted);
  font-size: 0.86rem;
}

.application-upload-preview {
  margin-top: 0.85rem;
  min-height: 170px;
  border-radius: 18px;
  background: #fffdf8;
  border: 1px solid rgba(221, 210, 173, 0.85);
  padding: 1rem;
  display: grid;
  place-items: center;
}

.application-upload-placeholder {
  text-align: center;
  color: var(--ce-muted);
}

.application-upload-placeholder i {
  display: block;
  font-size: 1.6rem;
  margin-bottom: 0.35rem;
  color: var(--ce-primary);
}

.application-upload-image {
  width: 100%;
  max-height: 220px;
  object-fit: cover;
  border-radius: 16px;
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.12);
}

.application-file-chip {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  width: 100%;
}

.application-file-icon {
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(232, 163, 61, 0.14);
  color: var(--ce-primary);
  font-size: 1.1rem;
}

.application-file-meta {
  min-width: 0;
}

.application-file-meta strong {
  display: block;
  color: var(--ce-ink);
}

.application-file-meta small {
  color: var(--ce-muted);
}

.application-checklist {
  display: grid;
  gap: 0.9rem;
}

.application-check {
  display: flex;
  gap: 0.8rem;
  align-items: flex-start;
}

.application-check-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 14px;
  display: grid;
  place-items: center;
  background: rgba(232, 163, 61, 0.14);
  color: var(--ce-primary);
}

.application-doc-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.application-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 0.8rem;
  border-radius: 999px;
  background: rgba(232, 163, 61, 0.16);
  color: var(--ce-ink);
  font-size: 0.9rem;
  font-weight: 600;
}

.rider-review-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, 0.7fr);
  gap: 1.5rem;
  padding: 2rem;
  border-radius: 28px;
  color: #fff;
  background: radial-gradient(circle at 85% 10%, rgba(232, 163, 61, 0.28), transparent 34%), linear-gradient(135deg, #0f172a 0%, #1e293b 58%, #0f766e 100%);
  box-shadow: 0 22px 45px rgba(15, 23, 42, 0.18);
  overflow: hidden;
}

.rider-review-hero-copy {
  align-self: center;
}

.rider-review-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.75rem;
  color: #f7c56b;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.rider-review-hero h1 {
  margin-bottom: 0.65rem;
  color: #fff;
  font-size: clamp(1.8rem, 3vw, 2.65rem);
}

.rider-review-hero p {
  max-width: 650px;
  margin-bottom: 1.2rem;
  color: rgba(255, 255, 255, 0.72);
}

.rider-review-tip {
  display: inline-flex;
  align-items: center;
  padding: 0.45rem 0.7rem;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.78rem;
}

.rider-review-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.7rem;
  align-self: stretch;
}

.rider-review-metric {
  position: relative;
  display: flex;
  min-height: 118px;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(8px);
}

.rider-review-metric span {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.76rem;
  font-weight: 700;
}

.rider-review-metric strong {
  color: #fff;
  font-size: 2rem;
  line-height: 1;
}

.rider-review-metric i {
  position: absolute;
  top: 0.9rem;
  right: 0.9rem;
  color: #f7c56b;
  font-size: 1.15rem;
}

.rider-review-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.rider-review-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  padding: 0.3rem;
  border: 1px solid rgba(221, 210, 173, 0.85);
  border-radius: 999px;
  background: var(--ce-paper-2);
}

.rider-review-filter {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.8rem;
  border-radius: 999px;
  color: var(--ce-muted);
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none;
}

.rider-review-filter span {
  display: inline-grid;
  min-width: 1.35rem;
  height: 1.35rem;
  place-items: center;
  border-radius: 999px;
  background: rgba(15, 118, 110, 0.1);
  color: var(--ce-primary);
  font-size: 0.72rem;
}

.rider-review-filter:hover,
.rider-review-filter.active {
  background: var(--ce-primary);
  color: #fff;
}

.rider-review-filter.active span {
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
}

.rider-application-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.rider-application-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 44px rgba(15, 23, 42, 0.12);
}

.rider-application-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(221, 210, 173, 0.7);
}

.rider-application-person {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  min-width: 0;
}

.rider-application-avatar {
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(15, 118, 110, 0.16), rgba(232, 163, 61, 0.2));
  color: var(--ce-primary);
  font-size: 1.25rem;
}

.rider-application-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
  margin: 1rem 0;
}

.rider-application-summary > div {
  padding: 0.8rem 0.9rem;
  border-radius: 16px;
  background: rgba(15, 118, 110, 0.055);
}

.rider-application-summary span {
  display: block;
  margin-bottom: 0.2rem;
  color: var(--ce-muted);
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
}

.rider-application-summary strong {
  display: block;
  overflow: hidden;
  color: var(--ce-ink);
  font-size: 0.9rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rider-review-form {
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(15, 118, 110, 0.13);
  border-radius: 18px;
  background: rgba(15, 118, 110, 0.04);
}

.application-review-details {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin: 1rem 0;
}

.application-review-detail {
  min-width: 0;
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(221, 210, 173, 0.72);
  border-radius: 16px;
  background: #fffdf8;
}

.application-review-detail-wide {
  grid-column: 1 / -1;
}

.application-review-detail > span,
.application-review-documents-head span {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--ce-muted);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.application-review-detail strong,
.application-review-detail-copy {
  display: block;
  color: var(--ce-ink);
  font-size: 0.9rem;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.application-review-detail a {
  color: var(--ce-primary);
  text-decoration: none;
}

.application-review-detail a:hover {
  text-decoration: underline;
}

.application-map-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-left: 0.45rem;
  font-size: 0.78rem;
  font-weight: 700;
  white-space: nowrap;
}

.application-review-documents {
  margin-top: 1rem;
  padding: 0.95rem;
  border: 1px solid rgba(15, 118, 110, 0.14);
  border-radius: 18px;
  background: rgba(15, 118, 110, 0.035);
}

.application-review-documents-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.7rem;
}

.application-review-documents-head span {
  margin-bottom: 0.1rem;
  color: var(--ce-primary);
}

.application-review-documents-head small {
  color: var(--ce-muted);
  font-size: 0.78rem;
}

.application-review-documents .application-doc-links {
  margin-bottom: 0;
}

.application-review-documents .btn {
  border-radius: 11px;
  font-weight: 700;
}

.rider-cor-inline-preview {
  overflow: hidden;
  border: 1px solid rgba(15, 118, 110, 0.14);
  border-radius: 14px;
  background: #fff;
}

.rider-cor-inline-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.7rem 0.8rem;
  color: var(--ce-primary);
  font-size: 0.82rem;
  font-weight: 700;
}

.rider-cor-inline-heading a {
  color: var(--ce-primary);
  font-weight: 600;
  text-decoration: none;
}

.rider-cor-inline-image-link {
  display: block;
  padding: 0 0.8rem 0.8rem;
  text-align: center;
}

.rider-cor-inline-image {
  display: block;
  width: 100%;
  max-height: 420px;
  object-fit: contain;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.rider-cor-inline-file {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0 0.8rem 0.8rem;
  padding: 0.8rem;
  border-radius: 10px;
  color: var(--ce-muted);
  background: #f8fafc;
  font-size: 0.84rem;
}

.rider-cor-inline-file > i {
  color: #dc2626;
  font-size: 1.4rem;
}

.rider-cor-inline-file a {
  margin-left: auto;
  color: var(--ce-primary);
  font-weight: 700;
  white-space: nowrap;
}

.rider-removal-alert {
  border: 1px solid rgba(245, 158, 11, 0.38);
  border-radius: 18px;
  box-shadow: 0 12px 28px rgba(245, 158, 11, 0.1);
}

.seller-removal-alert {
  border: 1px solid rgba(245, 158, 11, 0.38);
  border-radius: 18px;
  box-shadow: 0 12px 28px rgba(245, 158, 11, 0.1);
}

@media (max-width: 768px) {
  .rider-review-hero {
    grid-template-columns: 1fr;
    padding: 1.4rem;
    border-radius: 24px;
  }

  .rider-review-metric {
    min-height: 96px;
    padding: 0.75rem;
  }

  .rider-review-toolbar,
  .rider-application-head {
    align-items: flex-start;
    flex-direction: column;
  }

  .rider-review-filters {
    width: 100%;
    border-radius: 18px;
  }

  .rider-review-filter {
    flex: 1;
    justify-content: center;
  }

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

  .application-review-details {
    grid-template-columns: 1fr;
  }

  .application-review-detail-wide {
    grid-column: auto;
  }

  .application-review-documents {
    padding: 0.8rem;
  }

  .application-review-documents .application-doc-links .btn {
    flex: 1 1 100%;
    width: 100%;
  }

  .application-shell {
    border-radius: 24px;
  }

  .application-stepper {
    grid-template-columns: 1fr;
  }
}

/* Tables */
.table {
  background: #ffffff;
  border-color: var(--ce-line);
}
.table > :not(caption) > * > * {
  border-bottom-color: var(--ce-line);
  padding: 0.85rem 1rem;
}
.table thead th {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ce-muted);
  background: #f8fafc;
}
.table-hover tbody tr:hover {
  background-color: #f1f5f9;
}

/* Forms */
.form-control, .form-select {
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  padding: 0.65rem 0.9rem;
  background-color: #ffffff;
  color: var(--ce-ink);
  font-size: 0.95rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.form-control:focus, .form-select:focus {
  border-color: var(--ce-primary);
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.15);
  background-color: #ffffff;
}
.inline-field-error {
  margin-top: 0.35rem;
  color: #b42318;
  font-size: 0.78rem;
  font-weight: 650;
  line-height: 1.35;
}
.form-control.is-invalid,
.form-select.is-invalid,
.form-check-input.is-invalid {
  border-color: #dc2626;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}
.form-control.is-invalid:focus,
.form-select.is-invalid:focus,
.form-check-input.is-invalid:focus {
  border-color: #b91c1c;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.14);
}
.password-toggle {
  min-width: 44px;
}
.input-group-text {
  background: #f1f5f9;
  border-color: #cbd5e1;
  color: var(--ce-muted);
  border-radius: 10px;
}
.btn {
  border-radius: 10px;
  font-weight: 600;
  padding: 0.6rem 1.1rem;
  transition: all 0.2s ease;
}
.btn-primary {
  background: linear-gradient(135deg, #0f766e 0%, #0d9488 100%);
  border: none;
  box-shadow: 0 4px 12px rgba(15, 118, 110, 0.2);
}
.btn-primary:hover {
  background: linear-gradient(135deg, #0d9488 0%, #115e59 100%);
  box-shadow: 0 6px 16px rgba(15, 118, 110, 0.3);
}
.btn-warning {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  border: none;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.2);
}
.btn-warning:hover {
  background: linear-gradient(135deg, #d97706 0%, #b45309 100%);
  color: #ffffff;
}
.btn-outline-primary {
  color: var(--ce-primary);
  border-color: var(--ce-primary);
}
.btn-outline-primary:hover {
  background: var(--ce-primary);
  border-color: var(--ce-primary);
  color: #ffffff;
}
.btn-outline-secondary,
.btn-outline-success,
.btn-outline-danger {
  border-radius: 12px;
}

/* Map */
#map { z-index: 1; }

/* Badges */
.badge { font-weight: 500; padding: 0.4em 0.6em; }

/* Hero */
.display-5 {
  color: var(--ce-ink-soft);
}

/* Login / Register cards */
.card-body form .btn { padding: 0.55rem 1rem; }

/* Responsive */
@media (max-width: 768px) {
  .stat-card h3 { font-size: 1.4rem; }
  .display-5 { font-size: 2rem; }
}

/* Animations */
.card, .alert { animation: fadeIn 0.3s ease; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to   { opacity: 1; transform: none; }
}

/* Scrollbar */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #eef2f7; }
::-webkit-scrollbar-thumb { background: #b9c2d0; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #8a96aa; }

/* Utility accents used across pages */
.badge.bg-primary,
.text-bg-primary {
  background-color: var(--ce-primary) !important;
}
.badge.bg-warning,
.text-bg-warning {
  background-color: var(--ce-accent) !important;
  color: #10182b !important;
}
.badge.bg-success,
.text-bg-success {
  background-color: var(--ce-success) !important;
}
.badge.bg-danger,
.text-bg-danger {
  background-color: var(--ce-danger) !important;
}

/* Admin workspace */
.admin-page main.container-fluid {
  padding: 0 !important;
}
.admin-layout {
  display: flex;
  min-height: calc(100vh - 74px);
  position: relative;
}
.admin-sidebar {
  width: 274px;
  min-width: 274px;
  min-height: calc(100vh - 74px);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 74px;
  z-index: 1040;
  background: rgba(255, 255, 255, 0.96) !important;
}
.admin-sidebar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1.25rem 1.1rem 1rem;
  border-bottom: 1px solid #eef2f7;
}
.admin-sidebar-heading {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
}
.admin-sidebar-mark {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  color: #fff;
  background: linear-gradient(135deg, #0f766e, #2563eb);
  box-shadow: 0 6px 14px rgba(15, 118, 110, 0.2);
}
.admin-sidebar-title {
  color: var(--ce-ink);
  font-size: 0.86rem;
  font-weight: 800;
  line-height: 1.2;
}
.admin-sidebar-subtitle {
  color: var(--ce-muted);
  font-size: 0.72rem;
  margin-top: 0.15rem;
}
.admin-nav {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 0.8rem 0.85rem 1rem;
}
.admin-nav-section + .admin-nav-section {
  margin-top: 1.05rem;
}
.admin-nav-label {
  padding: 0 0.65rem 0.45rem;
  color: #94a3b8;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.admin-nav-link {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-height: 42px;
  padding: 0.55rem 0.65rem;
  border-radius: 11px;
  color: #475569;
  font-size: 0.87rem;
  font-weight: 650;
  text-decoration: none;
  transition: color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.admin-nav-link:hover {
  color: var(--ce-primary);
  background: #f0fdfa;
  transform: translateX(2px);
}
.admin-nav-link.active {
  color: #fff;
  background: linear-gradient(135deg, #0f766e, #0d9488);
  box-shadow: 0 6px 14px rgba(15, 118, 110, 0.2);
}
.admin-nav-icon {
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  color: #64748b;
  font-size: 0.95rem;
}
.admin-nav-link.active .admin-nav-icon {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
}
.admin-nav-text {
  min-width: 0;
  flex: 1 1 auto;
}
.admin-nav-badge {
  min-width: 22px;
  padding: 0.15rem 0.4rem;
  border-radius: 999px;
  color: #b91c1c;
  background: #fee2e2;
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
}
.admin-nav-link.active .admin-nav-badge {
  color: #fff;
  background: rgba(255, 255, 255, 0.2);
}
.admin-sidebar-footer {
  padding: 0.85rem 1rem 1.1rem;
  border-top: 1px solid #eef2f7;
}
.admin-home-link {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--ce-muted);
  font-size: 0.78rem;
  font-weight: 650;
  text-decoration: none;
}
.admin-home-link:hover { color: var(--ce-primary); }
.admin-content {
  min-width: 0;
  max-width: 1700px;
}
.admin-context-bar {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 0.65rem 0.85rem;
  border: 1px solid #e7edf4;
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.82);
}
.admin-context-dot {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.12);
}
.admin-context-label {
  color: var(--ce-muted);
  font-size: 0.76rem;
  font-weight: 700;
}
.admin-context-current {
  color: var(--ce-ink);
  font-size: 0.82rem;
  font-weight: 700;
}
.admin-page .admin-content > h3,
.admin-page .admin-content > h4 {
  margin-bottom: 1.15rem;
  font-weight: 800;
  color: var(--ce-ink);
}
.admin-page .admin-content > h3::after,
.admin-page .admin-content > h4::after {
  content: '';
  display: block;
  width: 34px;
  height: 3px;
  margin-top: 0.5rem;
  border-radius: 999px;
  background: var(--ce-accent);
}
.admin-page .admin-content .table-responsive {
  border-radius: 18px;
}
.admin-page .admin-content .card {
  overflow: hidden;
}
.admin-sidebar-backdrop { display: none; }
.min-w-0 { min-width: 0; }

/* Customer, seller, and rider workspace navigation */
.workspace-page main.container-fluid { padding: 0 !important; }
.workspace-layout {
  display: flex;
  min-height: calc(100vh - 74px);
  position: relative;
}
.workspace-sidebar {
  width: 250px;
  min-width: 250px;
  min-height: calc(100vh - 74px);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 74px;
  z-index: 1040;
  background: rgba(255, 255, 255, 0.96) !important;
}
.workspace-sidebar-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  padding: 1.2rem 1rem 1rem;
  border-bottom: 1px solid #eef2f7;
}
.workspace-sidebar-heading { display: flex; align-items: center; gap: 0.65rem; min-width: 0; }
.workspace-sidebar-mark {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  color: #fff;
  border-radius: 11px;
  background: linear-gradient(135deg, #0f766e, #2563eb);
}
.workspace-sidebar-title { color: var(--ce-ink); font-size: 0.83rem; font-weight: 800; line-height: 1.2; }
.workspace-sidebar-subtitle { margin-top: 0.14rem; color: var(--ce-muted); font-size: 0.7rem; }
.workspace-nav { flex: 1 1 auto; overflow-y: auto; padding: 0.95rem 0.8rem; }
.workspace-nav-label {
  padding: 0 0.6rem 0.45rem;
  color: #94a3b8;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.workspace-nav-link {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  min-height: 41px;
  padding: 0.52rem 0.6rem;
  color: #475569;
  border-radius: 10px;
  font-size: 0.85rem;
  font-weight: 650;
  text-decoration: none;
  transition: color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.workspace-nav-link:hover { color: var(--ce-primary); background: #f0fdfa; transform: translateX(2px); }
.workspace-nav-link.active { color: #fff; background: linear-gradient(135deg, #0f766e, #0d9488); box-shadow: 0 6px 14px rgba(15, 118, 110, 0.18); }
.workspace-nav-icon {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  display: grid;
  place-items: center;
  color: #64748b;
  border-radius: 8px;
}
.workspace-nav-link.active .workspace-nav-icon { color: #fff; background: rgba(255, 255, 255, 0.16); }
.workspace-sidebar-footer { padding: 0.85rem 0.95rem 1.1rem; border-top: 1px solid #eef2f7; }
.workspace-sidebar-footer a { display: flex; align-items: center; gap: 0.5rem; color: var(--ce-muted); font-size: 0.76rem; font-weight: 650; text-decoration: none; }
.workspace-sidebar-footer a:hover { color: var(--ce-primary); }
.workspace-content { min-width: 0; max-width: 1700px; }
.workspace-sidebar-backdrop { display: none; }
body.mobile-quick-nav-page > main.container-fluid {
  padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
}

body.mobile-quick-nav-page > footer {
  padding-bottom: calc(1.5rem + 76px + env(safe-area-inset-bottom)) !important;
}

.mobile-workspace-nav {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1025;
  display: none;
  align-items: stretch;
  gap: 0.2rem;
  padding: 0.35rem 0.45rem calc(0.35rem + env(safe-area-inset-bottom));
  border-top: 1px solid rgba(226, 232, 240, 0.95);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.1);
  backdrop-filter: blur(14px);
}

/* Keep the quick navigation fixed even though the theme positions body children. */
body.cx-theme > .mobile-workspace-nav {
  position: fixed;
  z-index: 1025;
}

.mobile-workspace-nav a {
  display: flex;
  min-width: 0;
  min-height: 56px;
  flex: 1 1 0;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  flex-direction: column;
  border-radius: 12px;
  color: #334155;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.mobile-workspace-nav a i {
  font-size: 1.15rem;
  line-height: 1;
}
.mobile-nav-icon-wrap { position: relative; display: inline-flex; line-height: 1; }
.mobile-nav-badge { position: absolute; top: -10px; right: -15px; display: inline-flex; min-width: 17px; height: 17px; align-items: center; justify-content: center; padding: 0 .25rem; color: #fff; background: #dc3545; border: 2px solid #fff; border-radius: 999px; font-size: .58rem; font-weight: 800; line-height: 1; box-shadow: 0 2px 6px rgba(127, 29, 29, .25); }

.mobile-workspace-nav a.active {
  color: #0f766e;
  background: #f0fdfa;
}

.mobile-workspace-nav a:active {
  background: #ccfbf1;
}

@media (max-width: 991.98px) {
  body.mobile-quick-nav-page > main.container-fluid {
    padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important;
  }

  body.mobile-quick-nav-page > footer {
    padding-bottom: calc(1.5rem + 76px + env(safe-area-inset-bottom)) !important;
  }

  .mobile-workspace-nav { display: flex; }
}

@media (min-width: 992px) {
  body.mobile-quick-nav-page > main.container-fluid { padding-bottom: 1rem !important; }
  body.mobile-quick-nav-page > footer { padding-bottom: 1.5rem !important; }
}

@media (max-width: 480px) {
  .mobile-workspace-nav { gap: .1rem; padding-right: .25rem; padding-left: .25rem; }
  .mobile-workspace-nav a { min-height: 54px; padding: .28rem .1rem; font-size: .62rem; }
  .mobile-workspace-nav a i { font-size: 1.05rem; }
  .mobile-nav-badge { top: -8px; right: -13px; min-width: 16px; height: 16px; font-size: .55rem; }
}

@media (max-width: 360px) {
  .mobile-workspace-nav a { font-size: .56rem; }
  .mobile-workspace-nav a i { font-size: 1rem; }
  .mobile-nav-badge { right: -11px; }
}

.cart-page-container {
  padding-bottom: calc(140px + env(safe-area-inset-bottom)) !important;
}

/* Keep the add-to-cart checkout prompt above the mobile quick-navigation bar. */
.position-fixed.cart-action-bar {
  bottom: 1rem !important;
  margin-bottom: 0 !important;
  z-index: 1075 !important;
}

@media (max-width: 991.98px) {
  .position-fixed.cart-action-bar {
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
  }
}

.admin-dashboard-page {
  display: flex;
  flex-direction: column;
  gap: 1.35rem;
}
.admin-welcome-panel {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  padding: clamp(1.35rem, 3vw, 2.25rem);
  color: #f8fafc;
  border-radius: 22px;
  background:
    radial-gradient(circle at 90% 10%, rgba(245, 158, 11, 0.25), transparent 25%),
    linear-gradient(135deg, #0f172a 0%, #1e293b 60%, #0f766e 100%);
  box-shadow: 0 20px 42px rgba(15, 23, 42, 0.16);
}
.admin-welcome-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 0.8rem;
  color: #fde68a;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.admin-welcome-title {
  margin: 0;
  color: #fff;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  font-weight: 800;
}
.admin-welcome-copy {
  max-width: 650px;
  margin: 0.55rem 0 0;
  color: rgba(248, 250, 252, 0.92);
  font-size: 0.92rem;
}
.admin-welcome-date {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  flex: 0 0 auto;
  padding: 0.55rem 0.8rem;
  color: #e2e8f0;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.08);
  font-size: 0.78rem;
  font-weight: 650;
}
.admin-dashboard-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
}
.admin-dashboard-collapsed { display: none !important; }
.admin-dashboard-action {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
  flex: 1 1 auto;
  padding: 0.85rem 0.95rem;
  color: var(--ce-ink);
  text-decoration: none;
  border: 1px solid #e5ebf2;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.045);
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.admin-dashboard-action { cursor: pointer; }
.admin-dashboard-action:hover {
  color: var(--ce-ink);
  border-color: #99f6e4;
  box-shadow: 0 10px 22px rgba(15, 118, 110, 0.08);
  transform: translateY(-2px);
}
.admin-dashboard-action > span:nth-child(2) { min-width: 0; flex: 1 1 auto; }
.admin-dashboard-action strong,
.admin-dashboard-action small { display: block; }
.admin-dashboard-action strong { font-size: 0.82rem; }
.admin-dashboard-action small { margin-top: 0.15rem; overflow: hidden; color: var(--ce-muted); font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-dashboard-action > i { color: #94a3b8; font-size: 1.2rem; }
.admin-dashboard-action-icon {
  width: 37px;
  height: 37px;
  flex: 0 0 37px;
  display: grid;
  place-items: center;
  border-radius: 11px;
}
.action-teal { color: #0f766e; background: #ccfbf1; }
.action-amber { color: #b45309; background: #fef3c7; }
.action-blue { color: #2563eb; background: #dbeafe; }
.admin-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
}
.dashboard-overview-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem;
  margin-bottom: 1.25rem;
}
.dashboard-overview-action {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.85rem 0.95rem;
  color: var(--ce-ink);
  text-align: left;
  border: 1px solid #e5ebf2;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.045);
  cursor: pointer;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.dashboard-overview-action:hover,
.dashboard-overview-action.is-active {
  color: var(--ce-ink);
  border-color: #99f6e4;
  box-shadow: 0 10px 22px rgba(15, 118, 110, 0.08);
  transform: translateY(-2px);
}
.dashboard-overview-action > span:nth-child(2) { min-width: 0; flex: 1 1 auto; }
.dashboard-overview-action strong,
.dashboard-overview-action small { display: block; }
.dashboard-overview-action strong { font-size: 0.82rem; }
.dashboard-overview-action small { margin-top: 0.15rem; overflow: hidden; color: var(--ce-muted); font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-overview-action > i { color: #94a3b8; font-size: 1.2rem; }
.dashboard-overview-icon {
  width: 37px;
  height: 37px;
  flex: 0 0 37px;
  display: grid;
  place-items: center;
  border-radius: 11px;
}
.dashboard-overview-icon.teal { color: #0f766e; background: #ccfbf1; }
.dashboard-overview-icon.amber { color: #b45309; background: #fef3c7; }
.dashboard-overview-icon.blue { color: #2563eb; background: #dbeafe; }
.dashboard-role-panel { display: none; }
.dashboard-role-panel.is-visible { display: block; }
.dashboard-role-split > [data-dashboard-group] { display: none; }
.dashboard-role-split > [data-dashboard-group].is-visible { display: block; }
.dashboard-only-mode > .dashboard-shell ~ * { display: none !important; }
.dashboard-only-mode > .dashboard-shell ~ .dashboard-remittance-stack { display: block !important; }
.dashboard-only-mode .dashboard-hero-actions { display: none !important; }
.customer-dashboard-page { display: flex; flex-direction: column; }
.customer-dashboard-page > .dashboard-shell { order: 1; }
.customer-dashboard-page > .customer-top-tools { order: 2; }
.customer-dashboard-page > .dashboard-overview-actions { order: 3; }
.customer-dashboard-page > .customer-network-containers { order: 4; }
.customer-dashboard-page > .customer-rider-availability { order: 5; }
.customer-dashboard-page > .customer-dashboard-stats { order: 6; }
.customer-dashboard-page > .customer-application-card { order: 7; }
.customer-application-source { display: none !important; }
.customer-network-containers > [data-dashboard-group].is-visible {
  flex: 0 0 100%;
  max-width: 100%;
}
@media (max-width: 575.98px) {
  .customer-dashboard-page .dashboard-panel .d-grid.gap-3 {
    display: grid !important;
    gap: 0.65rem !important;
    overflow: visible;
  }
  .customer-dashboard-page .dashboard-panel .d-grid.gap-3 > div {
    min-width: 0;
    padding: 0.7rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 13px;
    background: rgba(255, 255, 255, 0.05);
  }
}
.admin-section-heading h2 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 800;
}
.admin-section-heading p,
.admin-card-header p {
  margin: 0.25rem 0 0;
  color: var(--ce-muted);
  font-size: 0.82rem;
}
.admin-live-indicator {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: #047857;
  font-size: 0.75rem;
  font-weight: 750;
}
.admin-live-indicator span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #10b981;
  box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.12);
}
.admin-metric-card {
  position: relative;
  min-height: 168px;
  overflow: hidden;
  padding: 1.2rem;
  border: 1px solid #e5ebf2;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.055);
}
.admin-metric-card::after {
  content: '';
  position: absolute;
  width: 110px;
  height: 110px;
  right: -40px;
  bottom: -45px;
  border-radius: 50%;
  background: var(--metric-wash, rgba(15, 118, 110, 0.08));
}
.admin-metric-icon {
  width: 39px;
  height: 39px;
  display: grid;
  place-items: center;
  margin-bottom: 1rem;
  color: var(--metric-color, #0f766e);
  border-radius: 11px;
  background: var(--metric-wash, #f0fdfa);
}
.admin-metric-label {
  color: var(--ce-muted);
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.admin-metric-value {
  margin-top: 0.3rem;
  color: var(--ce-ink);
  font-size: clamp(1.45rem, 2.4vw, 2rem);
  font-weight: 800;
  line-height: 1.1;
}
.admin-metric-copy {
  margin-top: 0.35rem;
  color: var(--ce-muted);
  font-size: 0.76rem;
}
.accent-teal { --metric-color: #0f766e; --metric-wash: #ccfbf1; }
.accent-blue { --metric-color: #2563eb; --metric-wash: #dbeafe; }
.accent-violet { --metric-color: #7c3aed; --metric-wash: #ede9fe; }
.accent-amber { --metric-color: #b45309; --metric-wash: #fef3c7; }
.admin-earnings-card { overflow: hidden; }
.admin-earnings-kicker { display: block; margin-bottom: .15rem; color: #0f766e; font-size: .62rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.admin-earnings-rate { display: inline-flex; align-items: center; gap: .3rem; padding: .35rem .55rem; color: #0f766e; border-radius: 999px; background: #e7f8f4; font-size: .66rem; font-weight: 800; white-space: nowrap; }
.admin-earnings-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; padding: 1rem 1.3rem .75rem; }
.admin-earning-item { min-width: 0; padding: .9rem 1rem; border: 1px solid #e4ecef; border-radius: .85rem; background: #fbfefd; }
.admin-earning-label { display: flex; align-items: center; gap: .35rem; color: #6d7f8a; font-size: .66rem; font-weight: 800; }
.admin-earning-label i { color: #0f766e; }
.admin-earning-item strong { display: block; margin-top: .3rem; color: #0f766e; font-size: clamp(1.05rem, 2vw, 1.35rem); font-weight: 850; letter-spacing: -.03em; }
.admin-earning-item small, .admin-registration-total small { display: block; margin-top: .18rem; color: #8a99a5; font-size: .62rem; }
.earning-today { border-top: 3px solid #f59e0b; }
.earning-week { border-top: 3px solid #2563eb; }
.earning-month { border-top: 3px solid #0f766e; }
.earning-year { border-top: 3px solid #7c3aed; }
.admin-registration-total { display: flex; align-items: center; gap: .8rem; margin: .25rem 1.3rem 1.3rem; padding: .9rem 1rem; border: 1px solid #dcece8; border-radius: .85rem; background: linear-gradient(135deg, #f0fdfa, #f8fffd); }
.admin-registration-icon { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; color: #0f766e; border-radius: .7rem; background: #ccfbf1; font-size: 1rem; }
.admin-registration-total .admin-earning-label { color: #48636c; }
.admin-registration-total strong { display: block; margin-top: .15rem; color: #0f766e; font-size: 1.25rem; font-weight: 850; }
.admin-pickup-commission { margin: 0 1.3rem 1.3rem; padding: .95rem 1rem 1rem; border: 1px solid #dce7f2; border-radius: .9rem; background: linear-gradient(135deg, #f7fbff, #fbfaff); }
.admin-pickup-commission-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.admin-pickup-commission-head h4 { margin: .12rem 0 .18rem; color: #24394b; font-size: .95rem; font-weight: 850; }
.admin-pickup-commission-head p { margin: 0; color: #7a8997; font-size: .64rem; }
.admin-pickup-order-count { display: inline-flex; align-items: center; flex: 0 0 auto; padding: .35rem .55rem; color: #2563eb; border-radius: 999px; background: #eaf2ff; font-size: .62rem; font-weight: 800; white-space: nowrap; }
.admin-pickup-earnings-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .55rem; margin-top: .8rem; }
.admin-pickup-earning-item { min-width: 0; padding: .65rem .7rem; border: 1px solid #e2eaf2; border-radius: .7rem; background: rgba(255,255,255,.8); }
.admin-pickup-earning-item span { display: flex; align-items: center; gap: .3rem; color: #738494; font-size: .6rem; font-weight: 800; }
.admin-pickup-earning-item span i { color: #2563eb; }
.admin-pickup-earning-item strong { display: block; margin-top: .25rem; color: #2563eb; font-size: .95rem; font-weight: 850; letter-spacing: -.02em; }
.admin-pickup-commission-total { display: flex; align-items: center; gap: .55rem; margin-top: .7rem; padding-top: .7rem; border-top: 1px solid #e3ebf3; }
.admin-pickup-commission-total > span { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; color: #2563eb; border-radius: 9px; background: #eaf2ff; }
.admin-pickup-commission-total small { display: block; color: #71808d; font-size: .6rem; }
.admin-pickup-commission-total strong { display: block; margin-top: .1rem; color: #2563eb; font-size: 1.05rem; font-weight: 850; }
@media (max-width: 900px) { .admin-earnings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .admin-pickup-earnings-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 480px) { .admin-earnings-grid { gap: .5rem; padding: .75rem; } .admin-earning-item { padding: .75rem; } .admin-earning-label { font-size: .6rem; } .admin-earning-item strong { font-size: 1rem; } .admin-earning-item small, .admin-registration-total small { font-size: .58rem; } .admin-registration-total { margin: .25rem .75rem .75rem; padding: .75rem; } .admin-earnings-rate { align-self: flex-start; } .admin-pickup-commission { margin: 0 .75rem .75rem; padding: .75rem; } .admin-pickup-commission-head { flex-direction: column; gap: .55rem; } .admin-pickup-order-count { align-self: flex-start; } .admin-pickup-earning-item { padding: .6rem; } .admin-pickup-earning-item strong { font-size: .9rem; } }
.admin-card {
  overflow: hidden;
  border: 1px solid #e5ebf2;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.055);
}
.admin-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.3rem;
  border-bottom: 1px solid #edf1f5;
}
.admin-card-header h3 {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
}
.admin-queue-total {
  padding: 0.3rem 0.55rem;
  color: #475569;
  border-radius: 999px;
  background: #f1f5f9;
  font-size: 0.72rem;
  font-weight: 750;
  white-space: nowrap;
}
.admin-queue-list { padding: 0.25rem 1.3rem 0.65rem; }
.admin-queue-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.85rem 0;
  color: var(--ce-ink);
  text-decoration: none;
  border-bottom: 1px solid #f1f5f9;
}
.admin-queue-item:last-child { border-bottom: 0; }
.admin-queue-item:hover .admin-queue-body strong { color: var(--ce-primary); }
.admin-queue-icon {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  border-radius: 10px;
}
.queue-danger { color: #dc2626; background: #fee2e2; }
.queue-blue { color: #2563eb; background: #dbeafe; }
.queue-amber { color: #b45309; background: #fef3c7; }
.queue-violet { color: #7c3aed; background: #ede9fe; }
.queue-teal { color: #0f766e; background: #dff8f1; }
.admin-queue-body { min-width: 0; flex: 1 1 auto; }
.admin-queue-body strong { display: block; font-size: 0.84rem; transition: color 0.15s ease; }
.admin-queue-body small { display: block; margin-top: 0.15rem; color: var(--ce-muted); font-size: 0.73rem; }
.admin-queue-count {
  min-width: 24px;
  padding: 0.2rem 0.42rem;
  color: #94a3b8;
  border-radius: 999px;
  background: #f8fafc;
  font-size: 0.72rem;
  font-weight: 800;
  text-align: center;
}
.admin-queue-count.has-items { color: #b91c1c; background: #fee2e2; }
.admin-queue-arrow { color: #cbd5e1; font-size: 0.75rem; }
.admin-quick-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  padding: 1.3rem;
}
.admin-quick-link {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 118px;
  padding: 0.9rem;
  color: var(--ce-ink);
  text-decoration: none;
  border: 1px solid #e8edf3;
  border-radius: 13px;
  background: #fbfdff;
  transition: transform 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.admin-quick-link:hover {
  color: var(--ce-ink);
  border-color: #99f6e4;
  box-shadow: 0 8px 18px rgba(15, 118, 110, 0.08);
  transform: translateY(-2px);
}
.admin-quick-link > span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  margin-bottom: 0.65rem;
  color: var(--ce-primary);
  border-radius: 9px;
  background: #ccfbf1;
}
.admin-quick-link strong { font-size: 0.82rem; }
.admin-quick-link small { margin-top: 0.15rem; color: var(--ce-muted); font-size: 0.71rem; }

/* Editable system settings */
.settings-page {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.settings-hero {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.45rem 1.55rem;
  color: #f8fafc;
  border-radius: 18px;
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 62%, #0f766e 100%);
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.13);
}
.settings-hero h4 { color: #fff !important; }
.settings-hero h4::after { display: none !important; }
.settings-hero p { color: rgba(248, 250, 252, 0.72); font-size: 0.86rem; }
.settings-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.5rem;
  color: #fde68a;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.settings-edit-badge,
.settings-card-tag {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.38rem 0.65rem;
  color: #047857;
  border: 1px solid #a7f3d0;
  border-radius: 999px;
  background: #ecfdf5;
  font-size: 0.7rem;
  font-weight: 800;
  white-space: nowrap;
}
.settings-edit-badge {
  color: #fef3c7;
  border-color: rgba(254, 243, 199, 0.25);
  background: rgba(254, 243, 199, 0.12);
}
.settings-card {
  overflow: hidden;
  border: 1px solid #e5ebf2;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.055);
}
.settings-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.35rem;
  border-bottom: 1px solid #edf1f5;
}
.settings-card-header h5 { margin: 0; font-size: 1rem; font-weight: 800; }
.settings-card-header p { margin: 0.28rem 0 0; color: var(--ce-muted); font-size: 0.78rem; }
.settings-card-tag.readonly { color: #64748b; border-color: #e2e8f0; background: #f8fafc; }
.settings-form { padding: 1.35rem; }
.settings-subsection-note { display: flex; align-items: flex-start; gap: .45rem; padding: .7rem .8rem; color: #5f7180; border: 1px solid #dcece8; border-radius: .7rem; background: #f3fbf9; font-size: .7rem; }
.settings-subsection-note strong { display: block; color: #0f766e; font-size: .73rem; }
.settings-subsection-note span { margin-top: .08rem; }
.settings-form .form-label { margin-bottom: 0.38rem; font-size: 0.82rem; font-weight: 750; }
.settings-form .form-text { color: var(--ce-muted); font-size: 0.72rem; }
.settings-form .input-group-text { min-width: 40px; justify-content: center; }
.settings-form-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 1.25rem;
  padding-top: 1.1rem;
  color: var(--ce-muted);
  border-top: 1px solid #edf1f5;
  font-size: 0.75rem;
}
.settings-info-list { padding: 0.5rem 1.35rem; }
.settings-info-list > div {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.85rem 0;
  border-bottom: 1px solid #f1f5f9;
  font-size: 0.8rem;
}
.settings-info-list > div:last-child { border-bottom: 0; }
.settings-info-list span { color: var(--ce-muted); }
.settings-info-list strong { color: var(--ce-ink); text-align: right; }
.settings-note {
  display: flex;
  gap: 0.65rem;
  margin: 0.7rem 1.35rem 1.35rem;
  padding: 0.8rem;
  color: #475569;
  border-radius: 11px;
  background: #f8fafc;
  font-size: 0.75rem;
}
.settings-note i { color: var(--ce-primary); font-size: 1rem; }

@media (max-width: 991.98px) {
  /* Keep the last admin form controls above the fixed mobile quick navigation. */
  body.admin-page .admin-content {
    padding-bottom: calc(76px + env(safe-area-inset-bottom) + 1rem) !important;
  }
}

@media (max-width: 575.98px) {
  .settings-form-footer {
    align-items: stretch;
    flex-direction: column;
    gap: .75rem;
  }

  .settings-form-footer .btn {
    width: 100%;
  }
}

@media (max-width: 991.98px) {
  body.admin-menu-open { overflow: hidden; }

  .navbar-admin-menu,
  .navbar .navbar-toggler {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .admin-sidebar {
    position: fixed;
    top: 74px;
    bottom: 0;
    left: 0;
    height: calc(100vh - 74px);
    min-height: calc(100vh - 74px);
    transform: translateX(-105%);
    transition: transform 0.2s ease;
    box-shadow: 16px 0 36px rgba(15, 23, 42, 0.16) !important;
  }
  .admin-sidebar.is-open { transform: translateX(0); }
  .admin-sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1035;
    background: rgba(15, 23, 42, 0.42);
  }
  .admin-sidebar-backdrop.is-visible { display: block; }
  .admin-layout { min-height: calc(100vh - 74px); }

  .workspace-sidebar {
    width: min(86vw, 320px);
    min-width: min(86vw, 320px);
    position: fixed;
    top: 74px;
    bottom: 0;
    left: 0;
    height: calc(100vh - 74px);
    min-height: calc(100vh - 74px);
    transform: translateX(-105%);
    transition: transform 0.2s ease;
    box-shadow: 16px 0 36px rgba(15, 23, 42, 0.16) !important;
  }
  .workspace-sidebar.is-open { transform: translateX(0); }
  .workspace-sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1035;
    background: rgba(15, 23, 42, 0.42);
  }
  .workspace-sidebar-backdrop.is-visible { display: block; }
  .workspace-layout { min-height: calc(100vh - 74px); }
}
@media (max-width: 991.98px) {
  .workspace-nav-link,
  .admin-nav-link {
    min-height: 48px;
  }

  .workspace-nav-link,
  .admin-nav-link {
    color: #334155;
  }

  .workspace-nav-label,
  .admin-nav-label {
    color: #64748b;
  }

  .workspace-sidebar-top,
  .admin-sidebar-top {
    min-height: 68px;
  }

  .workspace-sidebar-close,
  .admin-sidebar-close {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
  }

  .cart-page-container .table-responsive {
    overflow-x: visible;
  }

  .cart-table,
  .cart-table tbody,
  .cart-table tr,
  .cart-table td {
    display: block;
    width: 100%;
  }

  .cart-table thead {
    display: none;
  }

  .cart-table tbody tr:not(.cart-total-row) {
    margin-bottom: 0.75rem;
    padding: 0.45rem;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #fff;
  }

  .cart-table tbody tr:not(.cart-total-row) td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.6rem 0.35rem;
    border: 0;
    text-align: right;
  }

  .cart-table tbody tr:not(.cart-total-row) td::before {
    flex: 0 0 auto;
    color: #64748b;
    content: attr(data-label);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }

  .cart-table tbody tr:not(.cart-total-row) td:first-child {
    display: block;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #eef2f7;
    text-align: left;
  }

  .cart-table tbody tr:not(.cart-total-row) td:first-child::before,
  .cart-table tbody tr:not(.cart-total-row) td:last-child::before {
    display: none;
  }

  .cart-table tbody tr:not(.cart-total-row) td:last-child {
    justify-content: flex-end;
  }

  .cart-table .cart-total-row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    padding: 0.75rem 0.35rem 0;
    border-top: 2px solid #e2e8f0;
  }

  .cart-table .cart-total-row td {
    display: block;
    width: auto;
    padding: 0.35rem 0;
    border: 0;
  }

  .cart-table .cart-total-row td:first-child {
    text-align: left !important;
  }

  .cart-table .cart-total-row td:last-child {
    text-align: right !important;
  }

}
@media (max-width: 575.98px) {
  .admin-dashboard-actions,
  .dashboard-overview-actions {
    grid-template-columns: 1fr;
    gap: 0.6rem;
  }
  .admin-welcome-panel { align-items: flex-start; flex-direction: column; }
  .admin-welcome-date { width: 100%; justify-content: center; }
  .admin-context-bar { align-items: flex-start; flex-direction: column; }
  .admin-context-bar .btn { width: 100%; }

  .admin-user-search {
    display: grid !important;
    grid-template-columns: 1fr auto;
    gap: 0.5rem;
  }

  .admin-user-search .form-control {
    min-width: 0;
    margin-right: 0 !important;
  }

  .admin-user-search .btn {
    white-space: nowrap;
  }

  .admin-user-actions {
    min-width: 178px;
    vertical-align: top;
  }

  .admin-user-actions form {
    display: block !important;
    margin: 0 0 0.35rem;
  }

  .admin-user-actions .btn,
  .admin-user-actions .badge {
    display: block;
    width: 100%;
    margin: 0 0 0.35rem;
    text-align: center;
    white-space: normal;
  }

  .admin-user-actions .badge {
    line-height: 1.2;
  }

  .admin-users-table,
  .admin-users-table tbody,
  .admin-users-table tr,
  .admin-users-table td {
    display: block;
    width: 100%;
  }

  .admin-users-table thead {
    display: none;
  }

  .admin-users-table tbody tr {
    margin-bottom: 0.85rem;
    overflow: hidden;
    border: 1px solid var(--ce-line);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
  }

  .admin-users-table tbody td {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.62rem 0.8rem;
    border-bottom: 1px solid #eef2f7;
    text-align: right;
    overflow-wrap: anywhere;
  }

  .admin-users-table tbody td::before {
    content: attr(data-label);
    flex: 0 0 auto;
    color: var(--ce-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-align: left;
    text-transform: uppercase;
  }

  .admin-users-table tbody td:nth-child(5)::before { content: 'Seller'; }
  .admin-users-table tbody td:nth-child(6)::before { content: 'Rider'; }

  .admin-users-table tbody td.admin-user-actions {
    display: block;
    padding: 0.8rem;
    text-align: left;
    border-bottom: 0;
  }

  .admin-users-table tbody td.admin-user-actions::before {
    display: block;
    margin-bottom: 0.55rem;
  }

  .rider-review-hero h1 {
    font-size: 1.65rem;
  }

  .rider-review-hero p {
    font-size: 0.88rem;
  }

  .rider-review-metrics {
    gap: 0.45rem;
  }

  .rider-review-metric {
    min-height: 86px;
    padding: 0.65rem;
    border-radius: 15px;
  }

  .rider-review-metric strong {
    font-size: 1.45rem;
  }

  .rider-review-metric span {
    font-size: 0.65rem;
  }

  .rider-review-metric i {
    top: 0.65rem;
    right: 0.65rem;
    font-size: 0.9rem;
  }

  .rider-review-filter {
    padding: 0.45rem 0.35rem;
    font-size: 0.72rem;
  }

  .rider-application-card .card-body {
    padding: 1rem;
  }

  .rider-application-person {
    align-items: flex-start;
  }

  .rider-application-person .small {
    overflow-wrap: anywhere;
  }

  .rider-application-avatar {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-radius: 13px;
  }

  .rider-review-form {
    padding: 0.8rem;
  }

  .rider-review-form .d-flex.align-items-end {
    align-items: stretch !important;
    flex-direction: column;
  }

  .rider-review-form .d-flex.align-items-end .btn {
    width: 100%;
  }

  .duty-period-row {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr) auto;
    width: 100%;
  }

  .duty-period-row > * {
    min-width: 0;
  }

  .duty-period-row .input-group-text,
  .duty-period-row .btn {
    padding-right: 0.45rem;
    padding-left: 0.45rem;
  }

  .application-doc-links .btn {
    flex: 1 1 135px;
  }

  .dashboard-shell {
    border-radius: 20px;
  }

  .dashboard-shell .p-4 {
    padding: 1.15rem !important;
  }

  .dashboard-kicker {
    padding: 0.42rem 0.7rem;
    font-size: 0.78rem;
  }

  .dashboard-lead {
    font-size: 0.9rem;
  }

  .dashboard-chip {
    padding: 0.42rem 0.62rem;
    font-size: 0.76rem;
  }

  .dashboard-stat {
    border-radius: 17px;
  }

  .dashboard-stat .card-body {
    padding: 0.85rem;
  }

  .dashboard-stat-inner {
    gap: 0.55rem;
  }

  .dashboard-stat-icon {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
    border-radius: 12px;
    font-size: 0.95rem;
  }

  .dashboard-stat-label {
    font-size: 0.6rem;
    letter-spacing: 0.04em;
  }

  .dashboard-stat-value {
    font-size: 1.35rem;
  }

  .dashboard-stat-copy {
    display: none;
  }

  .dashboard-action-card {
    gap: 0.7rem;
    padding: 0.85rem;
    border-radius: 17px;
  }

  .dashboard-action-icon {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
    border-radius: 13px;
  }

  .dashboard-action-title {
    font-size: 0.95rem;
  }

  .dashboard-action-desc {
    font-size: 0.76rem;
  }

  .dashboard-panel,
  .dashboard-note-card {
    border-radius: 19px;
  }

  .rider-removal-alert,
  .seller-removal-alert {
    padding: 0.85rem;
    font-size: 0.84rem;
  }

  .table-responsive {
    border-radius: 15px;
  }

  .table > :not(caption) > * > * {
    padding: 0.65rem 0.6rem;
  }

  .table thead th {
    font-size: 0.66rem;
  }

  .admin-content,
  .workspace-content {
    padding: 0.75rem !important;
  }

  .admin-context-bar {
    position: relative;
    top: auto;
    z-index: 1;
    display: flex;
    align-items: center;
    flex-direction: row;
    gap: 0.6rem;
    margin: -0.15rem 0 0.85rem;
    padding: 0.55rem 0.65rem;
    border-radius: 14px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  }

  .admin-context-bar > div {
    min-width: 0;
    overflow: hidden;
  }

  .admin-context-bar .admin-context-label,
  .admin-context-bar .text-muted {
    display: none;
  }

  .admin-context-bar .admin-context-current {
    display: block;
    font-size: 0.78rem;
  }

  .admin-context-bar .admin-context-back {
    width: auto !important;
    flex: 0 0 auto;
    padding: 0.48rem 0.65rem;
    white-space: nowrap;
  }

  /* The page header already stays visible on mobile; keep this context row in
     the document flow so it cannot cover the first application card. */
  .admin-context-bar {
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
  }

  .mobile-workspace-backbar {
    position: sticky;
    top: 74px;
    z-index: 1010;
    margin: -0.15rem 0 0.85rem;
    padding: 0.55rem;
    border: 1px solid #e6edf4;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
  }

  .mobile-workspace-backbar a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--ce-primary);
    font-size: 0.82rem;
    font-weight: 800;
    text-decoration: none;
  }

  .mobile-workspace-backbar a i {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 10px;
    background: rgba(15, 118, 110, 0.1);
  }

  .dashboard-page {
    gap: 0.85rem;
  }

  .dashboard-page > .row,
  .dashboard-page > section,
  .dashboard-page > .dashboard-shell {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }

  .dashboard-page .row {
    --bs-gutter-x: 0.7rem;
  }

  .dashboard-page .card,
  .dashboard-page .dashboard-shell,
  .dashboard-page .dashboard-note-card {
    width: 100%;
  }
}
/* Clear, mobile-friendly notification and rider assignment modals */
.rider-assignment-header,
.customer-alert-header {
  background: linear-gradient(135deg, #0f172a 0%, #1c2942 58%, #0e7c7b 100%);
  padding: 1.15rem 1.35rem;
}
body.cx-theme .rider-assignment-header .small,
body.cx-theme .customer-alert-header .small {
  color: #f8fafc !important;
}

.rider-assignment-dialog { display: flex; align-items: center; width: min(680px, calc(100vw - 1rem)); max-width: calc(100vw - 1rem); height: min(760px, calc(100vh - 1rem)); height: min(760px, calc(100dvh - 1rem)); max-height: calc(100vh - 1rem); max-height: calc(100dvh - 1rem); margin: .5rem auto; }
.rider-assignment-modal { display: flex; flex-direction: column; height: 100%; max-height: none; overflow: hidden; border-radius: 1rem; }
.rider-assignment-header,
.rider-assignment-footer { flex: 0 0 auto; }
.rider-assignment-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.rider-assignment-footer { position: relative; z-index: 2; flex: 0 0 auto; }
.rider-assignment-body { background: #f8fafc; padding: 1.35rem; }
.rider-assignment-summary {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  margin-bottom: 1rem; padding: .8rem 1rem; background: #fff;
  border: 1px solid #e5e7eb; border-radius: .8rem;
}
.rider-assignment-summary strong { display: block; color: #17213a; font-size: 1.2rem; }
.rider-assignment-label {
  display: block; color: #64748b; font-size: .7rem; font-weight: 700;
  letter-spacing: .06em; line-height: 1.2; text-transform: uppercase;
}
.rider-assignment-details {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem;
}
.rider-assignment-detail {
  display: flex; align-items: flex-start; gap: .75rem; min-width: 0;
  padding: .9rem; background: #fff; border: 1px solid #e5e7eb; border-radius: .8rem;
}
.rider-assignment-detail-wide { grid-column: 1 / -1; }
.rider-assignment-detail > i { flex: 0 0 auto; color: #0e7c7b; font-size: 1.15rem; line-height: 1.2; }
.rider-assignment-detail div { min-width: 0; }
.rider-assignment-detail strong {
  display: block; margin-top: .25rem; color: #17213a; font-size: .95rem;
  font-weight: 600; line-height: 1.4; overflow-wrap: anywhere;
}
.rider-assignment-detail small {
  display: block;
  margin-top: .25rem;
  color: #64748b;
  font-size: .72rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.rider-assignment-fee { background: #ecfdf5; border-color: #bbf7d0; }
.rider-assignment-fee strong { color: #047857; font-size: 1.05rem; }
.rider-assignment-items {
  margin-top: .75rem;
  padding: .8rem .9rem;
  border: 1px solid #dbe8eb;
  border-radius: .8rem;
  background: #fff;
}
.rider-assignment-items-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .65rem;
  margin-bottom: .45rem;
  color: #0f766e;
  font-size: .72rem;
  font-weight: 850;
}
.rider-assignment-items-heading small { color: #64748b; font-size: .66rem; font-weight: 700; }
.rider-assignment-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .42rem 0;
  border-top: 1px solid #edf2f4;
  color: #334155;
  font-size: .76rem;
}
.rider-assignment-item:first-child { border-top: 0; }
.rider-assignment-item span { min-width: 0; overflow-wrap: anywhere; }
.rider-assignment-item strong { color: #0f766e; }
.rider-assignment-item b { flex: 0 0 auto; color: #17213a; font-size: .74rem; }
.rider-assignment-package {
  margin-top: .65rem;
  padding: .6rem .75rem;
  color: #155e75;
  border: 1px solid #bae6fd;
  border-radius: .65rem;
  background: #f0f9ff;
  font-size: .72rem;
  font-weight: 700;
}
.rider-assignment-map-wrap {
  width: 100%;
  max-width: 100%;
  margin-top: .75rem;
  padding: .6rem;
  border: 1px solid #dbe8eb;
  border-radius: .8rem;
  background: #f8fbfc;
}
.rider-assignment-map-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  margin: 0 .1rem .45rem;
  color: #52626f;
  font-size: .67rem;
  font-weight: 800;
}
.rider-assignment-map-heading span { color: var(--ce-primary); }
.rider-assignment-map-heading small { color: #8a99a5; font-size: .62rem; font-weight: 600; }
.rider-assignment-map {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: clamp(130px, 24vw, 190px);
  min-height: 130px;
  overflow: hidden;
  border: 1px solid #dce8eb;
  border-radius: .7rem;
  background: #eaf3f5;
}
.rider-assignment-map .leaflet-control-layers { display: none; }
.rider-assignment-map.is-unavailable::after {
  content: 'Route coordinates unavailable';
  position: absolute;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: center;
  color: #64748b;
  background: rgba(248,251,252,.72);
  font-size: .72rem;
  font-weight: 700;
}
.rider-assignment-map .leaflet-container,
.rider-delivery-mini-map .leaflet-container {
  width: 100%;
  max-width: 100%;
  height: 100%;
}

/* Shared map sizing: every map stays inside its card on narrow screens. */
#map,
#riderShareMap,
#deliveryMap,
.checkout-map,
.track-order-map,
.pickup-map,
.seller-store-map,
.admin-live-map {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.leaflet-container {
  max-width: 100%;
  font-family: inherit;
}

/* Consistent role-based pins used across customer, rider, seller, and admin maps. */
.ce-map-marker-icon {
  background: transparent;
  border: 0;
}

.ce-map-marker {
  position: relative;
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  color: #fff;
  border: 3px solid #fff;
  border-radius: 50% 50% 50% 0;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .28);
  transform: rotate(-45deg);
}

.ce-map-marker::after {
  content: '';
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 50% 50% 50% 0;
}

.ce-map-marker i {
  position: relative;
  z-index: 1;
  font-size: 1.05rem;
  line-height: 1;
  transform: rotate(45deg);
}

.ce-map-marker-rider { background: #0f766e; }
.ce-map-marker-customer { background: #2563eb; }
.ce-map-marker-pickup { background: #d97706; }
.ce-map-marker-store { background: #f59e0b; color: #17213a; }
.ce-map-marker-campus { background: #7c3aed; }

.ce-map-popup {
  min-width: 150px;
  color: #334155;
  line-height: 1.45;
}

.ce-map-popup strong {
  display: block;
  margin-bottom: .2rem;
  color: #17213a;
}

.ce-map-popup small {
  display: block;
  margin-top: .25rem;
  color: #64748b;
}

@media (max-width: 576px) {
  .ce-map-marker {
    width: 36px;
    height: 36px;
  }
}
.rider-assignment-notes {
  margin-top: .75rem; padding: .75rem .9rem; color: #475569; background: #fff;
  border-left: 3px solid #e8a33d; border-radius: .35rem; font-size: .85rem;
  line-height: 1.45; overflow-wrap: anywhere;
}
.rider-assignment-countdown {
  margin-top: .85rem; padding: .65rem .8rem; color: #0f5132; background: #ecfdf5;
  border: 1px solid #bbf7d0; border-radius: .65rem; font-size: .8rem; font-weight: 800;
  text-align: center;
}
.rider-assignment-countdown.is-expired { color: #842029; background: #fff1f2; border-color: #fecdd3; }
.rider-assignment-footer,
.customer-alert-footer {
  display: flex; align-items: center; gap: .75rem; padding: .9rem 1.35rem; background: #fff; overflow: visible;
  position: sticky; bottom: 0; min-height: 78px;
}
.rider-assignment-status,
.customer-alert-status { flex: 1 1 auto; color: #64748b; font-size: .8rem; }
.rider-assignment-actions,
.customer-alert-actions { display: flex; gap: .6rem; }
.rider-assignment-actions { display: grid; grid-template-columns: repeat(2, minmax(130px, 1fr)); flex: 0 0 auto; width: min(100%, 360px); min-width: 260px; gap: .6rem; }
.rider-assignment-actions .btn,
.customer-alert-actions .btn { white-space: normal; }
.rider-assignment-actions .btn { display: inline-flex !important; visibility: visible !important; position: relative; z-index: 3; align-items: center; justify-content: center; min-height: 44px; min-width: 0; }

.customer-alert-dialog { max-width: 100%; margin: 0; }
.customer-alert-modal { background: #fff; }
#customerReturnModal.modal {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 1070 !important;
}
#customerReturnModal .modal-dialog {
  width: min(680px, calc(100vw - 1rem));
  max-width: calc(100vw - 1rem);
  height: calc(100vh - 1rem);
  height: calc(100dvh - 1rem);
  min-height: 0;
  margin: .5rem auto;
  display: flex;
  align-items: center;
}
#customerReturnModal .modal-content {
  width: 100%;
  height: min(760px, calc(100vh - 1rem));
  height: min(760px, calc(100dvh - 1rem));
  max-height: calc(100vh - 1rem);
  max-height: calc(100dvh - 1rem);
  min-height: 0;
  display: flex;
  flex-direction: column;
  border-radius: 1rem;
  overflow: hidden;
}
#customerReturnModal .customer-alert-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}
#customerReturnModal .customer-alert-footer {
  position: sticky;
  bottom: 0;
  z-index: 2;
  flex: 0 0 auto;
}
.customer-alert-body {
  background: radial-gradient(circle at top, rgba(232,163,61,.14), transparent 42%), linear-gradient(180deg, #fffdf8, #f8f0d9);
}
.customer-alert-card {
  width: min(100%, 680px); padding: clamp(1.25rem, 4vw, 2.5rem);
  background: rgba(255,255,255,.9); border: 1px solid rgba(232,163,61,.18);
  border-radius: 1.25rem; box-shadow: 0 16px 45px rgba(38, 31, 17, .1);
}
.customer-alert-icon {
  display: grid; width: 76px; height: 76px; place-items: center; color: #10182b;
  background: #e8a33d; border-radius: 50%; box-shadow: 0 14px 30px rgba(232,163,61,.28); font-size: 1.8rem;
}
.customer-alert-order { color: #64748b; font-size: .85rem; }
.customer-alert-order strong { color: #17213a; }
.customer-alert-title {
  margin: .45rem 0 .6rem; color: #10182b; font-size: clamp(1.7rem, 4vw, 2.6rem);
  font-weight: 800; line-height: 1.1; overflow-wrap: anywhere;
}
.customer-alert-message {
  color: #475569; font-size: clamp(1rem, 2.5vw, 1.2rem); line-height: 1.55; overflow-wrap: anywhere;
}
.customer-live-monitor {
  margin-top: 1.25rem; padding: 1rem; background: #f8fafc;
  border: 1px solid #dbe4ee; border-radius: .9rem; text-align: left;
}
.customer-live-monitor-heading {
  display: flex; align-items: center; justify-content: space-between; gap: .75rem;
  color: #64748b; font-size: .78rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em;
}
.customer-live-monitor-heading strong { color: #0e7c7b; font-size: .9rem; text-transform: none; letter-spacing: 0; }
.customer-live-rider { display: flex; align-items: center; gap: .65rem; margin-top: .85rem; padding: .7rem .75rem; color: #0f172a; background: #f0fdfa; border: 1px solid #99f6e4; border-radius: .75rem; }
.customer-live-rider-avatar { display: grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; color: #fff; background: #0e7c7b; border-radius: 50%; }
.customer-live-rider-copy { min-width: 0; flex: 1; }
.customer-live-rider-copy span,
.customer-live-rider-copy strong,
.customer-live-rider-copy small { display: block; }
.customer-live-rider-copy span { color: #0f766e; font-size: .66rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.customer-live-rider-copy strong { margin-top: .1rem; color: #134e4a; font-size: .82rem; overflow-wrap: anywhere; }
.customer-live-rider-copy small { margin-top: .1rem; color: #64748b; font-size: .7rem; overflow-wrap: anywhere; }
.customer-live-rider-call { display: grid; width: 32px; height: 32px; flex: 0 0 32px; place-items: center; color: #fff; background: #16a34a; border-radius: 50%; text-decoration: none; }
.customer-live-rider-call:hover { color: #fff; background: #15803d; }
.customer-live-steps { display: flex; align-items: flex-start; gap: .15rem; margin-top: 1rem; overflow-x: auto; padding-bottom: .25rem; }
.customer-live-step { position: relative; display: flex; flex: 1 0 74px; min-width: 74px; flex-direction: column; align-items: center; gap: .35rem; color: #94a3b8; font-size: .68rem; font-weight: 700; line-height: 1.2; text-align: center; }
.customer-live-step::before { content: ''; position: absolute; top: 13px; left: calc(-50% + 13px); width: calc(100% - 10px); height: 2px; background: #dbe4ee; }
.customer-live-step:first-child::before { display: none; }
.customer-live-step-dot { position: relative; z-index: 1; display: grid; width: 27px; height: 27px; place-items: center; color: #94a3b8; background: #e2e8f0; border: 2px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px #dbe4ee; font-size: .72rem; }
.customer-live-step.is-complete,
.customer-live-step.is-current { color: #0f766e; }
.customer-live-step.is-complete::before { background: #5eead4; }
.customer-live-step.is-complete .customer-live-step-dot,
.customer-live-step.is-current .customer-live-step-dot { color: #fff; background: #0e7c7b; box-shadow: 0 0 0 1px #0e7c7b; }
.customer-live-step.is-current .customer-live-step-dot { background: #e8a33d; box-shadow: 0 0 0 2px #e8a33d; }
.customer-live-updated { margin-top: .75rem; color: #64748b; font-size: .72rem; text-align: center; }
.customer-live-cancelled { padding: .75rem; color: #b42318; background: #fff1f2; border: 1px solid #fecdd3; border-radius: .65rem; font-size: .8rem; font-weight: 700; text-align: center; }
.customer-live-cancel-prompt { display: flex; align-items: flex-start; gap: .55rem; margin-top: .75rem; padding: .7rem .75rem; color: #92400e; background: #fffbeb; border: 1px solid #fde68a; border-radius: .65rem; font-size: .76rem; font-weight: 700; line-height: 1.4; }
.customer-live-cancel-prompt i { flex: 0 0 auto; margin-top: .1rem; }
.customer-live-handoff { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1rem; padding: .85rem; background: #ecfdf5; border: 1px solid #bbf7d0; border-radius: .75rem; }
.customer-live-handoff span,
.customer-live-handoff strong,
.customer-live-handoff small { display: block; }
.customer-live-handoff span { color: #166534; font-size: .72rem; font-weight: 800; text-transform: uppercase; }
.customer-live-handoff strong { margin-top: .2rem; color: #14532d; font-size: 1.35rem; letter-spacing: .18em; }
.customer-live-handoff small { margin-top: .2rem; color: #3f6212; font-size: .7rem; }
.customer-live-handoff canvas { flex: 0 0 auto; width: 132px; height: 132px; background: #fff; border-radius: .35rem; }
.customer-alert-next {
  display: flex; align-items: flex-start; gap: .75rem; margin-top: 1.5rem; padding: 1rem;
  color: #664b08; background: #fff4c7; border: 1px solid #f8df86; border-radius: .75rem;
}
.customer-alert-next > i { flex: 0 0 auto; margin-top: .1rem; font-size: 1.1rem; }
.customer-alert-next strong,
.customer-alert-next span { display: block; }
.customer-alert-next span { margin-top: .25rem; font-size: .88rem; line-height: 1.45; overflow-wrap: anywhere; }

@media (max-width: 575.98px) {
  .rider-assignment-dialog { width: calc(100vw - 1rem); max-width: calc(100vw - 1rem); max-height: calc(100vh - 1rem); max-height: calc(100dvh - 1rem); margin: .5rem; }
  .rider-assignment-header,
  .customer-alert-header { padding: 1rem; }
  .rider-assignment-body { padding: 1rem; }
  .rider-assignment-details { grid-template-columns: 1fr; }
  .rider-assignment-detail-wide { grid-column: auto; }
  .rider-assignment-footer,
  .customer-alert-footer { align-items: stretch; flex-direction: column; padding: .85rem 1rem; }
  .rider-assignment-footer,
  .customer-alert-footer { min-height: 0; }
  .rider-assignment-status,
  .customer-alert-status { width: 100%; }
  .rider-assignment-actions,
  .customer-alert-actions { width: 100%; }
  .rider-assignment-actions .btn,
  .customer-alert-actions .btn { flex: 1 1 0; }
  .customer-alert-card { padding: 1.25rem 1rem; border-radius: .9rem; }
  .customer-live-monitor { padding: .8rem .65rem; }
  .customer-live-monitor-heading { align-items: flex-start; flex-direction: column; gap: .2rem; }
  .customer-live-handoff { align-items: stretch; flex-direction: column; }
  .customer-live-handoff canvas { align-self: center; }
  .rider-assignment-dialog { height: calc(100vh - 1rem); height: calc(100dvh - 1rem); }
  .rider-assignment-actions,
  .customer-alert-actions { flex-wrap: wrap; }
  .rider-assignment-actions { grid-template-columns: 1fr; width: 100%; min-width: 0; }
  .rider-assignment-actions .btn,
  .customer-alert-actions .btn { width: 100%; flex: 1 1 100%; }
  #customerReturnModal .modal-dialog { width: calc(100vw - 1rem); max-width: calc(100vw - 1rem); height: calc(100vh - 1rem); height: calc(100dvh - 1rem); margin: .5rem; }
}

/* The theme gives footer children their own stacking context. Lift it while a modal is open. */
body.cx-theme > footer:has(.modal.show) {
  z-index: 1060;
}

/* Keep notifications and dashboard alerts on the viewport, never at the page bottom. */
body.cx-theme > .modal {
  z-index: 1070 !important;
}
body.cx-theme > .modal-backdrop {
  z-index: 1065 !important;
}
body.cx-theme > .modal .modal-dialog {
  max-height: calc(100vh - 1rem);
  max-height: calc(100dvh - 1rem);
}
#sessionTakeoverModal .modal-dialog {
  width: min(420px, calc(100vw - 1rem));
  max-width: calc(100vw - 1rem);
  margin: .5rem auto;
}
#sessionTakeoverModal .modal-content {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 1rem);
  max-height: calc(100dvh - 1rem);
  overflow: hidden;
}
#sessionTakeoverModal .modal-body {
  min-height: 0;
  overflow-y: auto;
  overflow-wrap: anywhere;
}
#sessionTakeoverModal .modal-footer {
  flex-wrap: wrap;
}
#sessionTakeoverModal .modal-footer .btn {
  max-width: 100%;
  white-space: normal;
}
#globalToastContainer {
  top: calc(72px + .75rem) !important;
  right: .75rem !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 1085 !important;
  width: min(360px, calc(100vw - 1.5rem));
  display: flex;
  flex-direction: column;
  gap: .65rem;
}
body.modal-open #globalToastContainer {
  display: none !important;
}
#globalToastContainer .dashboard-toast-label,
#globalToastContainer .toast-body .small {
  color: #f8fafc !important;
}
#globalToastContainer .dashboard-toast-label {
  opacity: .9;
  letter-spacing: .05em;
}
body.cx-theme #globalToastContainer .toast-body {
  color: #f8fafc !important;
}
body.cx-theme #globalToastContainer .text-bg-warning {
  color: #f8fafc !important;
  background-color: #b45309 !important;
}

.global-confirm-modal {
  overflow: hidden;
  border-radius: 1.25rem;
}

.global-confirm-modal .modal-body {
  padding-top: 1.6rem !important;
}

.global-confirm-icon {
  display: grid;
  width: 54px;
  height: 54px;
  margin: 0 auto .8rem;
  place-items: center;
  color: #0f766e;
  background: #e6f8f3;
  border-radius: 18px;
  font-size: 1.45rem;
}

.global-confirm-icon.is-danger {
  color: #b42318;
  background: #fff0ed;
}

.global-confirm-kicker {
  margin-bottom: .25rem;
  color: #0f766e;
  font-size: .68rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.global-confirm-modal h5 {
  color: #17213a;
  font-weight: 800;
}

.global-confirm-modal p {
  font-size: .86rem;
  line-height: 1.5;
}

.global-confirm-modal .modal-footer .btn {
  min-height: 42px;
  border-radius: .75rem;
  font-weight: 700;
}

.custom-choice {
  position: relative;
  width: 100%;
}

.custom-choice-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.custom-choice-button {
  display: flex;
  width: 100%;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: .55rem .75rem;
  color: #26334d;
  text-align: left;
  background: #fff;
  border: 1px solid #d9e2ee;
  border-radius: .7rem;
  font: inherit;
  cursor: pointer;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.custom-choice-button:hover,
.custom-choice-button[aria-expanded="true"] {
  border-color: #0f8f83;
  box-shadow: 0 0 0 .2rem rgba(15, 143, 131, .12);
}

.custom-choice-label {
  overflow: hidden;
  color: #52627c;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-choice-button[aria-expanded="true"] .custom-choice-label,
.custom-choice-option.is-selected {
  color: #0f766e;
  font-weight: 700;
}

.custom-choice-button i {
  flex: 0 0 auto;
  color: #0f766e;
  transition: transform .2s ease;
}

.custom-choice-button[aria-expanded="true"] i {
  transform: rotate(180deg);
}

.custom-choice-menu {
  position: absolute;
  z-index: 1090;
  top: calc(100% + .35rem);
  right: 0;
  left: 0;
  max-height: 240px;
  padding: .35rem;
  overflow-y: auto;
  background: #fff;
  border: 1px solid #d9e2ee;
  border-radius: .75rem;
  box-shadow: 0 12px 28px rgba(24, 40, 72, .16);
}

.custom-choice-option {
  display: block;
  width: 100%;
  padding: .65rem .7rem;
  color: #34425d;
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: .5rem;
  font: inherit;
  cursor: pointer;
}

.custom-choice-option:hover,
.custom-choice-option:focus-visible,
.custom-choice-option.is-selected {
  background: #e9f8f4;
  outline: none;
}

@media (max-width: 575.98px) {
  .custom-choice-menu {
    max-height: 200px;
  }
}

@media (max-width: 575.98px) {
  #globalToastContainer {
    top: calc(72px + .5rem) !important;
    right: .75rem !important;
    left: .75rem !important;
    width: auto;
  }
}

/* Do not let the page quick-nav cover modal actions on mobile. */
body:has(.modal.show) > .mobile-workspace-nav {
  display: none !important;
}

/* Bootstrap adds modal-open to body, covering browsers without :has support. */
body.modal-open > .mobile-workspace-nav {
  display: none !important;
}

/* Leave room for the fixed quick navigation so the bottom of the workspace menu stays reachable. */
@media (max-width: 991.98px) {
  body.admin-page .admin-sidebar {
    bottom: calc(76px + env(safe-area-inset-bottom));
    height: calc(100vh - 74px - 76px - env(safe-area-inset-bottom));
    min-height: calc(100vh - 74px - 76px - env(safe-area-inset-bottom));
  }

body.mobile-quick-nav-page .workspace-sidebar {
    bottom: calc(76px + env(safe-area-inset-bottom));
    height: calc(100vh - 74px - 76px - env(safe-area-inset-bottom));
    min-height: calc(100vh - 74px - 76px - env(safe-area-inset-bottom));
  }
}

/* My Cart refresh */
.cart-page-container {
  max-width: 1100px !important;
}
.cart-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.cart-page-heading h1 {
  margin: 0;
  color: var(--ce-ink);
  font-size: clamp(1.45rem, 3vw, 2rem);
  font-weight: 800;
  letter-spacing: -.03em;
}
.cart-page-heading p {
  margin: .3rem 0 0;
  color: var(--ce-muted);
  font-size: .86rem;
}
.cart-item-count {
  padding: .48rem .75rem;
  color: #0f766e;
  background: #dffaf3;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 800;
  white-space: nowrap;
}
.cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
  align-items: start;
  gap: 1.25rem;
}
.cart-items-panel,
.cart-summary-card,
.cart-empty-card {
  background: #fff;
  border: 1px solid #e5eaf0;
  border-radius: 1.1rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}
.cart-items-panel { overflow: hidden; }
.cart-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: 1rem 1.1rem;
  background: linear-gradient(135deg, #f8fffd, #fff);
  border-bottom: 1px solid #edf2f5;
}
.cart-panel-heading h2 {
  display: inline;
  margin: 0;
  color: var(--ce-ink);
  font-size: 1rem;
  font-weight: 800;
}
.cart-panel-heading span {
  margin-left: .45rem;
  color: var(--ce-muted);
  font-size: .72rem;
}
.cart-continue-link {
  color: var(--ce-primary);
  font-size: .76rem;
  font-weight: 750;
  text-decoration: none;
  white-space: nowrap;
}
.cart-continue-link:hover { color: var(--ce-primary-hover); }
.cart-item-list { padding: .75rem; }
.cart-item-card {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: .85rem;
  border: 1px solid #edf1f5;
  border-radius: .9rem;
  background: #fff;
}
.cart-item-card + .cart-item-card { margin-top: .65rem; }
.cart-item-image-wrap { width: 96px; }
.cart-item-image {
  display: block;
  width: 96px;
  height: 96px;
  object-fit: cover;
  border-radius: .75rem;
}
.cart-item-image-placeholder {
  display: grid;
  place-items: center;
  color: #94a3b8;
  background: linear-gradient(135deg, #f1f5f9, #e2e8f0);
  font-size: 1.7rem;
}
.cart-item-info { min-width: 0; }
.cart-item-store {
  overflow: hidden;
  color: var(--ce-primary);
  font-size: .7rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cart-item-info h3 {
  display: -webkit-box;
  margin: .25rem 0 .2rem;
  color: var(--ce-ink);
  font-size: .98rem;
  font-weight: 750;
  line-height: 1.3;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.cart-item-price {
  color: #475569;
  font-size: .8rem;
  font-weight: 700;
}
.cart-item-price span { color: #94a3b8; font-size: .68rem; font-weight: 500; }
.cart-item-controls {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin-top: .6rem;
}
.cart-item-controls label {
  color: var(--ce-muted);
  font-size: .68rem;
  font-weight: 700;
}
.cart-item-controls input { width: 62px; text-align: center; }
.cart-remove-btn {
  padding: .2rem .35rem;
  color: #dc3545;
  font-size: .72rem;
  text-decoration: none;
}
.cart-remove-btn:hover { color: #b02a37; }
.cart-item-subtotal {
  align-self: start;
  color: var(--ce-primary);
  font-size: 1rem;
  font-weight: 800;
  white-space: nowrap;
}
.cart-summary-card {
  position: sticky;
  top: 90px;
  padding: 1.15rem;
}
.cart-summary-heading {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: 1rem;
  color: var(--ce-primary);
}
.cart-summary-heading i { font-size: 1.15rem; }
.cart-summary-heading h2 { margin: 0; color: var(--ce-ink); font-size: 1rem; font-weight: 800; }
.cart-summary-row,
.cart-summary-total {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  color: #475569;
  font-size: .82rem;
}
.cart-summary-row + .cart-summary-row { margin-top: .7rem; }
.cart-summary-row strong { color: var(--ce-ink); }
.cart-summary-muted { color: #94a3b8; font-size: .74rem; }
.cart-summary-divider { height: 1px; margin: 1rem 0; background: #e9eef2; }
.cart-summary-total { color: var(--ce-ink); font-size: .92rem; font-weight: 750; }
.cart-summary-total strong { color: var(--ce-primary); font-size: 1.25rem; }
.cart-summary-note {
  margin: 1rem 0;
  padding: .7rem .75rem;
  color: #64748b;
  background: #f8fafc;
  border-radius: .65rem;
  font-size: .7rem;
  line-height: 1.45;
}
.cart-checkout-btn { padding: .7rem; border-radius: .7rem; font-weight: 750; }
.cart-empty-card { padding: 3rem 1.25rem; text-align: center; }
.cart-empty-icon {
  display: grid;
  width: 72px;
  height: 72px;
  margin: 0 auto 1rem;
  place-items: center;
  color: var(--ce-primary);
  background: #dffaf3;
  border-radius: 50%;
  font-size: 1.8rem;
}
.cart-empty-card h2 { margin: 0; color: var(--ce-ink); font-size: 1.2rem; font-weight: 800; }
.cart-empty-card p { margin: .45rem 0 1.2rem; color: var(--ce-muted); font-size: .84rem; }

@media (max-width: 767.98px) {
  .cart-layout { grid-template-columns: 1fr; }
  .cart-summary-card { position: static; }
}

@media (max-width: 575.98px) {
  .cart-page-heading { align-items: flex-start; margin-bottom: 1rem; }
  .cart-page-heading p { font-size: .76rem; }
  .cart-item-count { font-size: .64rem; }
  .cart-panel-heading { padding: .85rem .9rem; }
  .cart-item-list { padding: .55rem; }
  .cart-item-card {
    grid-template-columns: 68px minmax(0, 1fr);
    gap: .7rem;
    padding: .65rem;
  }
  .cart-item-image-wrap,
  .cart-item-image { width: 68px; height: 68px; }
  .cart-item-info h3 { font-size: .82rem; }
  .cart-item-store { font-size: .62rem; }
  .cart-item-price { font-size: .72rem; }
  .cart-item-controls { flex-wrap: wrap; margin-top: .45rem; }
  .cart-item-controls label { font-size: .62rem; }
  .cart-item-controls input { width: 54px; font-size: .75rem; }
  .cart-remove-btn { margin-left: auto; font-size: .68rem; }
  .cart-item-subtotal { grid-column: 2; margin-top: -.35rem; font-size: .88rem; }
  .cart-summary-card { padding: .95rem; }
}

/* Checkout refresh */
.checkout-page-container {
  max-width: 1100px !important;
  padding-bottom: calc(140px + env(safe-area-inset-bottom));
}
.checkout-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.checkout-page-heading h1 {
  margin: 0;
  color: var(--ce-ink);
  font-size: clamp(1.45rem, 3vw, 2rem);
  font-weight: 800;
  letter-spacing: -.03em;
}
.checkout-page-heading p { margin: .3rem 0 0; color: var(--ce-muted); font-size: .86rem; }
.checkout-secure-badge {
  padding: .48rem .75rem;
  color: #0f766e;
  background: #dffaf3;
  border-radius: 999px;
  font-size: .72rem;
  font-weight: 800;
  white-space: nowrap;
}
.checkout-alert { margin-bottom: 1rem; border: 0; border-radius: .8rem; font-size: .78rem; }
.checkout-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 350px);
  align-items: start;
  gap: 1.25rem;
}
.checkout-details-panel,
.checkout-summary-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e5eaf0;
  border-radius: 1.1rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}
.checkout-panel-heading {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1.1rem 1.2rem;
  background: linear-gradient(135deg, #f8fffd, #fff);
  border-bottom: 1px solid #edf2f5;
}
.checkout-panel-icon,
.checkout-summary-icon {
  display: grid;
  width: 40px;
  height: 40px;
  flex: 0 0 auto;
  place-items: center;
  color: var(--ce-primary);
  background: #dffaf3;
  border-radius: .75rem;
  font-size: 1.1rem;
}
.checkout-panel-heading h2,
.checkout-summary-heading h2 { margin: 0; color: var(--ce-ink); font-size: 1rem; font-weight: 800; }
.checkout-panel-heading p { margin: .2rem 0 0; color: var(--ce-muted); font-size: .74rem; }
.checkout-details-body { padding: 1.2rem; }
.checkout-form-group { margin-bottom: 1.1rem; }
.checkout-form-group .form-label { margin-bottom: .4rem; color: var(--ce-ink); font-size: .78rem; font-weight: 800; }
.checkout-form-group .form-label i { color: var(--ce-primary); }
.checkout-form-group .form-label span { color: var(--ce-muted); font-weight: 500; }
.checkout-form-group .form-control { border-color: #dce5ea; border-radius: .7rem; }
.checkout-form-group .form-control:focus { border-color: rgba(15, 118, 110, .55); box-shadow: 0 0 0 .2rem rgba(15, 118, 110, .1); }
.checkout-field-help { margin-top: .35rem; color: var(--ce-muted); font-size: .68rem; }
.checkout-map-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin: 1.35rem 0 .65rem; }
.checkout-map-heading strong { display: block; color: var(--ce-ink); font-size: .82rem; }
.checkout-map-heading span:not(.checkout-map-badge) { display: block; margin-top: .2rem; color: var(--ce-muted); font-size: .68rem; }
.checkout-map-badge { padding: .35rem .55rem; color: var(--ce-primary); background: #eefbf8; border-radius: 999px; font-size: .64rem; font-weight: 800; white-space: nowrap; }
.checkout-location-actions { display: flex; align-items: center; gap: .7rem; margin-bottom: .65rem; }
.checkout-location-actions .btn { border-radius: .65rem; font-size: .72rem; font-weight: 800; }
.checkout-location-status { color: #b45309; font-size: .68rem; font-weight: 700; }
.checkout-location-status.is-selected { color: #047857; }
.checkout-map { height: 300px; overflow: hidden; border: 1px solid #dce5ea; border-radius: .85rem; box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }
.checkout-map-help { margin-top: .55rem; color: var(--ce-muted); font-size: .68rem; }
.checkout-summary-card { position: sticky; top: 90px; padding: 1.15rem; }
.checkout-summary-heading { display: flex; align-items: center; gap: .7rem; margin-bottom: 1rem; }
.checkout-summary-heading > div:last-child { min-width: 0; }
.checkout-summary-heading span { display: block; margin-top: .2rem; color: var(--ce-muted); font-size: .68rem; }
.checkout-item-list { padding: .1rem 0 .2rem; }
.checkout-store-name { margin: .7rem 0 .35rem; color: var(--ce-primary); font-size: .68rem; font-weight: 800; }
.checkout-store-name:first-child { margin-top: 0; }
.checkout-item-row,
.checkout-summary-row,
.checkout-summary-total { display: flex; align-items: center; justify-content: space-between; gap: .75rem; color: #475569; font-size: .78rem; }
.checkout-item-row + .checkout-item-row { margin-top: .42rem; }
.checkout-item-row span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.checkout-item-row small { margin-left: .35rem; color: #94a3b8; font-size: .68rem; }
.checkout-item-row strong { color: var(--ce-ink); font-size: .76rem; white-space: nowrap; }
.checkout-summary-divider { height: 1px; margin: 1rem 0; background: #e9eef2; }
.checkout-summary-row + .checkout-summary-row { margin-top: .65rem; }
.checkout-summary-row strong { color: var(--ce-ink); }
.checkout-summary-total { margin-top: .85rem; color: var(--ce-ink); font-size: .9rem; font-weight: 800; }
.checkout-summary-total strong { color: var(--ce-primary); font-size: 1.25rem; }
.checkout-delivery-hint { margin: 1rem 0; padding: .7rem .75rem; color: #64748b; background: #f8fafc; border-radius: .65rem; font-size: .68rem; line-height: 1.45; }
.checkout-payment-card { display: flex; align-items: center; gap: .65rem; margin: 1rem 0; padding: .75rem; background: #fff8e7; border: 1px solid #f4df9c; border-radius: .75rem; }
.checkout-payment-icon { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; color: #a16207; background: #fde68a; border-radius: .6rem; }
.checkout-payment-card strong,
.checkout-payment-card span { display: block; }
.checkout-payment-card strong { color: #713f12; font-size: .75rem; }
.checkout-payment-card span { margin-top: .15rem; color: #92400e; font-size: .66rem; }
.checkout-place-btn { padding: .72rem; border-radius: .7rem; font-weight: 800; }
.checkout-back-link { display: block; margin-top: .75rem; color: var(--ce-muted); font-size: .75rem; font-weight: 700; text-align: center; text-decoration: none; }
.checkout-back-link:hover { color: var(--ce-primary); }
.checkout-empty-note { padding: .85rem; color: var(--ce-muted); background: #f8fafc; border-radius: .7rem; font-size: .74rem; }

@media (max-width: 767.98px) {
  .checkout-layout { grid-template-columns: 1fr; }
  .checkout-summary-card { position: static; }
}

@media (max-width: 575.98px) {
  .checkout-page-heading { align-items: flex-start; margin-bottom: 1rem; }
  .checkout-page-heading p { font-size: .76rem; }
  .checkout-secure-badge { font-size: .64rem; }
  .checkout-panel-heading,
  .checkout-details-body { padding: .95rem; }
  .checkout-map { height: 245px; }
  .checkout-map-heading { align-items: flex-start; flex-direction: column; }
  .checkout-location-actions { align-items: flex-start; flex-direction: column; gap: .45rem; }
  .checkout-summary-card { padding: .95rem; }
}

/* My Orders - responsive container cards without horizontal table scrolling. */
body.workspace-page { overflow-x: hidden; }
.workspace-content { min-width: 0; }
.orders-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.orders-page-heading > div:first-child { min-width: 0; }
.orders-eyebrow {
  color: var(--ce-primary);
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.orders-page-heading h1 {
  margin: .25rem 0 .2rem;
  color: var(--ce-ink);
  font-size: clamp(1.45rem, 3vw, 2rem);
  font-weight: 850;
}
.orders-page-heading p {
  max-width: 560px;
  margin: 0;
  color: var(--ce-muted);
  font-size: .84rem;
}
.orders-count {
  display: inline-flex;
  align-items: baseline;
  gap: .35rem;
  padding: .65rem .85rem;
  color: #0f766e;
  background: #dffaf3;
  border: 1px solid #c5f2e8;
  border-radius: 999px;
  white-space: nowrap;
}
.orders-count strong { font-size: 1.1rem; }
.orders-count span { font-size: .7rem; font-weight: 750; }
.orders-filter-panel {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) 150px 135px 145px auto;
  gap: .6rem;
  align-items: center;
  margin-bottom: .35rem;
  padding: .7rem;
  background: #fff;
  border: 1px solid #e3eaf0;
  border-radius: 1rem;
  box-shadow: 0 6px 18px rgba(15, 23, 42, .045);
}
.orders-search-box {
  display: flex;
  align-items: center;
  gap: .55rem;
  min-width: 0;
  padding: 0 .75rem;
  color: #94a3b8;
  background: #f8fafc;
  border: 1px solid #e8eef3;
  border-radius: .7rem;
}
.orders-search-box i { flex: 0 0 auto; }
.orders-search-box input {
  width: 100%;
  min-width: 0;
  height: 40px;
  color: var(--ce-ink);
  background: transparent;
  border: 0;
  outline: 0;
  font-size: .78rem;
}
.orders-search-box input::placeholder { color: #94a3b8; }
.orders-filter-select { min-width: 0; height: 40px; font-size: .75rem; border-radius: .7rem; }
.orders-clear-filter { height: 40px; color: #64748b; border: 1px solid #e8eef3; border-radius: .7rem; font-size: .74rem; font-weight: 750; white-space: nowrap; }
.orders-filter-summary { margin: .55rem .15rem .8rem; color: #94a3b8; font-size: .7rem; font-weight: 700; }
.orders-filter-summary span { color: var(--ce-primary); font-size: .85rem; }
.orders-filter-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: .3rem;
  min-height: 160px;
  margin-top: .9rem;
  color: #94a3b8;
  background: #fff;
  border: 1px dashed #cbd5e1;
  border-radius: 1rem;
  text-align: center;
}
.orders-filter-empty i { color: var(--ce-primary); font-size: 1.35rem; }
.orders-filter-empty strong { color: var(--ce-ink); font-size: .9rem; }
.orders-filter-empty span { font-size: .73rem; }
.order-card[hidden] { display: none !important; }
.orders-list { display: grid; gap: .9rem; min-width: 0; }
.order-card {
  min-width: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid #e3eaf0;
  border-radius: 1.15rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}
.order-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.1rem;
  background: linear-gradient(135deg, #f5fffc, #fff);
  border-bottom: 1px solid #edf2f5;
}
.order-card-identity { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.order-card-icon,
.orders-empty-icon {
  display: grid;
  place-items: center;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  color: #0f766e;
  background: #dffaf3;
  border-radius: 13px;
}
.order-card-kicker { color: var(--ce-muted); font-size: .68rem; font-weight: 700; }
.order-card h2 { margin: .12rem 0 0; color: var(--ce-ink); font-size: 1rem; font-weight: 850; }
.order-card-date { color: #64748b; font-size: .7rem; white-space: nowrap; }
.order-card-statuses {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  padding: .8rem 1.1rem;
  border-bottom: 1px solid #edf2f5;
}
.order-card-statuses > div {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-width: 0;
}
.order-card-statuses span,
.order-detail-item span {
  color: #94a3b8;
  font-size: .65rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.order-card-statuses .badge { font-size: .68rem; }
.order-card-details {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(180px, .8fr);
  gap: .75rem;
  padding: 1rem 1.1rem;
}
.order-detail-item {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  min-width: 0;
  padding: .7rem;
  background: #f8fafc;
  border: 1px solid #eef2f6;
  border-radius: .8rem;
}
.order-detail-icon {
  display: grid;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  place-items: center;
  color: var(--ce-primary);
  background: #e9fbf6;
  border-radius: 9px;
}
.order-detail-item > div { min-width: 0; }
.order-detail-item span { display: block; margin-bottom: .2rem; }
.order-detail-item strong {
  display: block;
  overflow: hidden;
  color: var(--ce-ink);
  font-size: .8rem;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.order-detail-item .order-total { color: var(--ce-primary); font-size: .98rem; }
.order-card-actions {
  display: flex;
  justify-content: flex-end;
  gap: .55rem;
  padding: .85rem 1.1rem 1rem;
  border-top: 1px solid #edf2f5;
}
.order-card-actions .btn { border-radius: .65rem; font-size: .75rem; font-weight: 750; }
.order-cancel-form, .order-delete-form { margin: 0; }
.orders-empty-card {
  padding: 3rem 1.25rem;
  text-align: center;
  background: #fff;
  border: 1px solid #e3eaf0;
  border-radius: 1.15rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}
.orders-empty-icon { width: 70px; height: 70px; margin: 0 auto 1rem; border-radius: 50%; font-size: 1.7rem; }
.orders-empty-card h2 { margin: 0; color: var(--ce-ink); font-size: 1.15rem; font-weight: 850; }
.orders-empty-card p { margin: .45rem 0 1.15rem; color: var(--ce-muted); font-size: .82rem; }

@media (max-width: 575.98px) {
  .orders-page-heading { align-items: flex-start; margin-bottom: 1rem; }
  .orders-page-heading p { font-size: .75rem; }
  .orders-count { padding: .5rem .65rem; }
  .orders-count strong { font-size: .95rem; }
  .orders-count span { font-size: .62rem; }
  .orders-filter-panel { grid-template-columns: 1fr 1fr; padding: .6rem; }
  .orders-search-box { grid-column: 1 / -1; }
  .orders-filter-select, .orders-clear-filter { width: 100%; }
  .order-card-top { align-items: flex-start; padding: .85rem; }
  .order-card-date { max-width: 112px; text-align: right; white-space: normal; line-height: 1.35; }
  .order-card-icon { flex-basis: 36px; width: 36px; height: 36px; border-radius: 11px; }
  .order-card h2 { font-size: .88rem; }
  .order-card-statuses { padding: .7rem .85rem; gap: .45rem .8rem; }
  .order-card-statuses > div { flex: 1 1 130px; justify-content: space-between; }
  .order-card-details { grid-template-columns: 1fr; padding: .75rem .85rem; }
  .order-detail-item { padding: .62rem; }
  .order-card-actions { flex-direction: column; padding: .75rem .85rem .85rem; }
  .order-card-actions .btn { width: 100%; }
  .order-cancel-form, .order-delete-form { width: 100%; }
}

/* Customer order details */
.order-view-page { max-width: 1120px; }
.order-view-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1.15rem 1.25rem;
  color: #fff;
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 58%, #0f766e 100%);
  border-radius: 1.15rem;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .14);
}
.order-view-hero-main { display: flex; align-items: center; gap: .8rem; min-width: 0; }
.order-view-mark {
  display: grid;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  place-items: center;
  color: #dffaf3;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 15px;
  font-size: 1.25rem;
}
.order-view-eyebrow { color: #a7f3d0; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.order-view-hero h1 { margin: .2rem 0 .22rem; font-size: 1.35rem; font-weight: 850; }
.order-view-hero p { margin: 0; color: rgba(255,255,255,.7); font-size: .72rem; }
.order-view-hero-status { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .4rem; }
.order-view-hero-status .badge { padding: .5rem .65rem; font-size: .68rem; }
.order-view-panel,
.order-view-summary-card {
  min-width: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid #e3eaf0;
  border-radius: 1.05rem;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .055);
}
.order-view-panel + .order-view-panel { margin-top: .9rem; }
.delivery-proof-body { display:flex; align-items:center; gap:.85rem; padding:1rem 1.1rem; color:#52626f; background:#f8fbfc; font-size:.72rem; line-height:1.4; }
.delivery-proof-body img { display:block; width:min(220px, 42%); max-height:190px; object-fit:cover; border:1px solid #dbe8ed; border-radius:.75rem; background:#fff; }
.delivery-proof-body span { min-width:0; }
.delivery-proof-body span i { color:#16845f; }
.admin-delivery-proof { color:#52626f; font-size:.76rem; }
.admin-delivery-proof img { display:block; width:min(100%, 300px); max-height:220px; object-fit:cover; border:1px solid #dbe8ed; border-radius:.75rem; }
@media (max-width: 575.98px) {
  .delivery-proof-body { align-items:flex-start; flex-direction:column; }
  .delivery-proof-body img { width:min(100%, 280px); max-height:240px; }
  .order-handoff-pin { align-items: flex-start; }
  .order-handoff-pin > div { flex: 1 1 calc(100% - 42px); }
  .order-handoff-qr-code { width:132px; height:132px; flex-basis:132px; margin: .65rem auto 0; }
}
.order-view-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding: 1rem 1.1rem;
  border-bottom: 1px solid #edf2f5;
}
.order-view-section-kicker { display: block; color: var(--ce-primary); font-size: .64rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.order-view-panel h2 { margin: .18rem 0 0; color: var(--ce-ink); font-size: .98rem; font-weight: 850; }
.order-track-link { color: var(--ce-primary); font-size: .75rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.order-track-link:hover { color: var(--ce-primary-hover); }
.order-status-panel { margin-bottom: .9rem; }
.order-status-timeline { display: flex; align-items: flex-start; padding: 1.05rem 1.1rem 1.15rem; }
.order-status-step { position: relative; display: flex; flex: 1 1 0; flex-direction: column; align-items: center; gap: .42rem; min-width: 0; color: #94a3b8; text-align: center; }
.order-status-step:not(:last-child)::after { position: absolute; top: 15px; left: calc(50% + 17px); width: calc(100% - 34px); height: 2px; background: #e2e8f0; content: ''; }
.order-status-step.is-complete::after { background: #5eead4; }
.order-status-dot { position: relative; z-index: 1; display: grid; width: 31px; height: 31px; place-items: center; background: #f1f5f9; border: 2px solid #e2e8f0; border-radius: 50%; font-size: .72rem; }
.order-status-step span { max-width: 75px; font-size: .63rem; font-weight: 750; line-height: 1.2; }
.order-status-step.is-complete, .order-status-step.is-current { color: var(--ce-primary); }
.order-status-step.is-complete .order-status-dot { color: #fff; background: #14b8a6; border-color: #14b8a6; }
.order-status-step.is-current .order-status-dot { color: #fff; background: #0f766e; border-color: #0f766e; box-shadow: 0 0 0 5px #dffaf3; }
.order-view-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(265px, 315px); align-items: start; gap: 1rem; }
.order-view-main, .order-view-side { min-width: 0; }
.order-view-items { padding: .75rem; }
.order-view-item { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto auto; align-items: center; gap: .7rem; padding: .65rem; border: 1px solid #edf1f5; border-radius: .85rem; }
.order-view-item + .order-view-item { margin-top: .6rem; }
.order-view-item-image { display: block; width: 58px; height: 58px; object-fit: cover; border-radius: .7rem; }
.order-view-item-placeholder { display: grid; place-items: center; color: #94a3b8; background: #f1f5f9; font-size: 1.15rem; }
.order-view-item-copy { min-width: 0; }
.order-view-item-copy h3 { display: -webkit-box; margin: 0 0 .2rem; overflow: hidden; color: var(--ce-ink); font-size: .82rem; font-weight: 800; line-height: 1.25; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.order-view-item-copy span { color: #94a3b8; font-size: .68rem; }
.order-view-item-qty { color: #64748b; font-size: .75rem; font-weight: 800; white-space: nowrap; }
.order-view-item-total { color: var(--ce-primary); font-size: .82rem; white-space: nowrap; }
.order-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; padding: 1rem 1.1rem; }
.order-view-info { display: flex; align-items: flex-start; gap: .6rem; min-width: 0; padding: .7rem; background: #f8fafc; border: 1px solid #eef2f6; border-radius: .75rem; }
.order-view-info > i { display: grid; flex: 0 0 29px; width: 29px; height: 29px; place-items: center; color: var(--ce-primary); background: #e9fbf6; border-radius: 8px; }
.order-view-info > div { min-width: 0; }
.order-view-info span { display: block; margin-bottom: .18rem; color: #94a3b8; font-size: .62rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.order-view-info strong { display: block; overflow: hidden; color: var(--ce-ink); font-size: .76rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.order-handoff-pin { grid-column: 1 / -1; align-items: center; flex-wrap: wrap; background: #f0f9ff; border-color: #bae6fd; }
.order-handoff-pin > div { flex: 1 1 150px; min-width: 0; }
.order-handoff-pin > i { color: #0369a1; background: #e0f2fe; }
.order-handoff-pin strong { display: block; overflow: visible; color: #0369a1; font-size: 1.05rem; letter-spacing: .12em; line-height: 1.35; white-space: normal; }
.order-handoff-pin small { display: block; margin-top: .2rem; color: #52626f; font-size: .66rem; line-height: 1.35; }
.order-handoff-qr-code { display: block; flex: 0 0 148px; width: 148px; height: 148px; margin-left: auto; padding: .35rem; background: #fff; border: 1px solid #bae6fd; border-radius: .7rem; }
.order-view-note { display: flex; gap: .55rem; margin: 0 1.1rem 1rem; padding: .7rem .75rem; color: #64748b; background: #fffbeb; border: 1px solid #fef3c7; border-radius: .7rem; font-size: .73rem; line-height: 1.4; }
.order-view-note i { color: #d97706; }
.order-view-summary-card { position: sticky; top: 90px; padding-bottom: 1rem; }
.order-view-summary-card .order-view-panel-heading { padding-bottom: .85rem; }
.order-summary-icon { color: var(--ce-primary); font-size: 1.15rem; }
.order-summary-row, .order-summary-total { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .65rem 1.1rem 0; color: #64748b; font-size: .78rem; }
.order-summary-row strong { color: var(--ce-ink); }
.order-summary-divider { height: 1px; margin: .9rem 1.1rem .25rem; background: #e9eef2; }
.order-summary-total { padding-top: .35rem; color: var(--ce-ink); font-weight: 800; }
.order-summary-total strong { color: var(--ce-primary); font-size: 1.2rem; }
.order-payment-chip { display: flex; align-items: center; gap: .45rem; margin: 1rem 1.1rem 0; padding: .65rem .7rem; color: #64748b; background: #f8fafc; border-radius: .7rem; font-size: .68rem; }
.order-payment-chip i { color: #16a34a; font-size: 1rem; }
.order-payment-chip span { flex: 1 1 auto; }
.order-payment-chip .badge { font-size: .6rem; }
.order-rider-card { padding-bottom: 1rem; }
.order-rider-info { display: flex; align-items: center; gap: .65rem; padding: 1rem 1.1rem 0; }
.order-rider-avatar { display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; color: var(--ce-primary); background: #dffaf3; border-radius: 50%; }
.order-rider-info div:last-child { min-width: 0; }
.order-rider-info strong, .order-rider-info span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.order-rider-info strong { color: var(--ce-ink); font-size: .8rem; }
.order-rider-info span { margin-top: .14rem; color: #94a3b8; font-size: .68rem; }
.order-view-muted { display: flex; align-items: center; gap: .55rem; padding: 1rem 1.1rem 0; color: #94a3b8; font-size: .75rem; }
.order-view-muted i { font-size: 1.15rem; }
.order-view-actions { display: grid; gap: .55rem; margin-top: .9rem; }
.order-view-actions .btn { width: 100%; border-radius: .7rem; font-size: .76rem; font-weight: 800; }
.order-view-actions form { margin: 0; }
.order-view-alert { display: flex; align-items: flex-start; gap: .65rem; margin: .9rem 0; padding: .75rem .9rem; border-radius: .75rem; font-size: .75rem; line-height: 1.4; }
.order-view-alert i { flex: 0 0 auto; font-size: 1rem; }
.order-view-alert strong, .order-view-alert span { display: block; }
.order-view-alert-danger { color: #991b1b; background: #fef2f2; border: 1px solid #fecaca; }
.order-view-alert-success { color: #166534; background: #f0fdf4; border: 1px solid #bbf7d0; }
.order-view-alert-warning { color: #92400e; background: #fffbeb; border: 1px solid #fde68a; }
.order-rating-required { display: inline-flex; align-items: center; color: #a16207; font-size: .72rem; font-weight: 700; }
.order-review-panel { padding-bottom: 1.1rem; }
.order-review-panel form { padding: 0 1.1rem; }
.order-review-panel > .order-view-alert { margin-right: 1.1rem; margin-left: 1.1rem; }
.seller-order-context { color: var(--ce-muted); font-size: .68rem; font-weight: 800; }
.seller-rider-form { padding: 1rem 1.1rem 0; }
.seller-rider-form .form-label { margin-bottom: .4rem; color: var(--ce-muted); font-size: .68rem; font-weight: 800; }
.seller-rider-form .form-select { border-color: #dce5ea; border-radius: .7rem; font-size: .76rem; }
.seller-rider-form .btn { border-radius: .7rem; font-size: .75rem; font-weight: 800; }
.seller-store-image-preview { display: block; width: min(100%, 260px); height: 150px; object-fit: cover; border: 1px solid #dce5ea; border-radius: .85rem; }
.store-map-popup { min-width: 190px; color: #172033; font-family: 'Plus Jakarta Sans', 'Inter', system-ui, sans-serif; }
.store-map-popup-image { display: block; width: 100%; height: 92px; margin-bottom: .55rem; object-fit: cover; border-radius: .65rem; }
.store-map-popup-title { margin-bottom: .2rem; font-weight: 850; font-size: .82rem; }
.store-map-popup-details { color: #64748b; font-size: .68rem; line-height: 1.4; }
.store-map-popup-address { margin-top: .35rem; color: #475569; font-size: .66rem; }
.track-order-selector { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; padding: 1rem 1.1rem; }
.track-order-selector-copy h2 { margin: .18rem 0 .15rem; color: var(--ce-ink); font-size: .95rem; font-weight: 850; }
.track-order-selector-copy p { margin: 0; color: var(--ce-muted); font-size: .7rem; }
.track-order-selector-form { flex: 0 1 330px; }
.track-order-selector-form .form-select { border-color: #dce5ea; border-radius: .7rem; font-size: .76rem; }
.track-live-chip,
.track-map-refresh { color: #047857; background: #dffaf3; border-radius: 999px; font-size: .64rem; font-weight: 800; white-space: nowrap; }
.track-live-chip { padding: .38rem .6rem; }
.track-map-refresh { padding: .35rem .55rem; }
.track-map-wrap { padding: .75rem; }
.track-order-map { height: 480px; overflow: hidden; border: 1px solid #dce5ea; border-radius: .85rem; }
.track-map-help { padding: 0 .9rem 1rem; color: var(--ce-muted); font-size: .68rem; }
.track-order-info-card { padding-bottom: 1rem; }
.track-order-info-card .order-view-panel-heading { padding-bottom: .85rem; }
.track-order-info-list { display: grid; gap: .6rem; padding: .9rem 1.1rem 0; }
.track-order-info-list .order-view-info { padding: .65rem; }
.track-rider-status { display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin: .75rem 1.1rem 0; color: var(--ce-muted); font-size: .68rem; }
.track-empty-state { align-items: flex-start; margin-top: .9rem; }
.track-empty-state > i { margin-top: .1rem; color: #0f766e; }

@media (max-width: 767.98px) {
  .track-order-selector { align-items: stretch; flex-direction: column; }
  .track-order-selector-form { flex-basis: auto; max-width: none; }
}

@media (max-width: 575.98px) {
  .track-order-selector { padding: .85rem .9rem; }
  .track-map-wrap { padding: .6rem; }
  .track-order-map { height: 360px; }
  .track-map-help { padding-right: .9rem; padding-bottom: .85rem; padding-left: .9rem; }
  .track-map-refresh { font-size: .58rem; }
}

@media (max-width: 767.98px) {
  .order-view-layout { grid-template-columns: 1fr; }
  .order-view-summary-card { position: static; }
  .order-view-side { display: contents; }
  .order-view-summary-card { order: -1; }
}

@media (max-width: 575.98px) {
  .order-view-page { padding-top: .75rem !important; }
  .order-view-hero { align-items: flex-start; flex-direction: column; padding: .9rem; border-radius: .95rem; }
  .order-view-hero-status { justify-content: flex-start; }
  .order-view-mark { flex-basis: 40px; width: 40px; height: 40px; border-radius: 12px; }
  .order-view-hero h1 { font-size: 1.1rem; }
  .order-status-timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem .25rem; padding: .9rem .7rem 1rem; }
  .order-status-step { display: flex; }
  .order-status-step:not(:last-child)::after { display: none; }
  .order-status-step span { font-size: .58rem; }
  .order-view-panel-heading { padding: .85rem .9rem; }
  .order-view-items { padding: .6rem; }
  .order-view-item { grid-template-columns: 48px minmax(0, 1fr) auto; gap: .55rem; padding: .55rem; }
  .order-view-item-image { width: 48px; height: 48px; }
  .order-view-item-qty { grid-column: 2; margin-top: -.35rem; font-size: .68rem; }
  .order-view-item-total { grid-column: 3; grid-row: 1 / span 2; align-self: center; font-size: .76rem; }
  .order-detail-grid { grid-template-columns: 1fr; padding: .75rem .9rem; }
  .order-view-note { margin-right: .9rem; margin-left: .9rem; }
  .order-summary-row, .order-summary-total { padding-right: .9rem; padding-left: .9rem; }
  .order-summary-divider { margin-right: .9rem; margin-left: .9rem; }
  .order-payment-chip, .order-rider-info, .order-view-muted { margin-right: .9rem; margin-left: .9rem; }
  .order-view-actions { margin-top: .75rem; }
}

/* Request Pickup */
.pickup-page {
  --pickup-ink: #172033;
  --pickup-muted: #718096;
  --pickup-line: #e6edf2;
  --pickup-teal: #0f766e;
  --pickup-teal-soft: #e7f8f4;
  --pickup-gold: #e8a33d;
  --pickup-gold-soft: #fff5e5;
  max-width: 1180px;
}
.pickup-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
  margin-bottom: 1.1rem;
  padding: 1.25rem 1.35rem;
  color: #fff;
  overflow: hidden;
  border-radius: 1.25rem;
  background: radial-gradient(circle at 88% 16%, rgba(255,255,255,.18), transparent 27%), linear-gradient(120deg, #0c5f5a, #159484 58%, #e8a33d 160%);
  box-shadow: 0 14px 30px rgba(15, 118, 110, .16);
}
.pickup-hero-copy { display: flex; align-items: center; gap: .9rem; min-width: 0; }
.pickup-hero-icon {
  display: grid;
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  place-items: center;
  color: #fff;
  font-size: 1.45rem;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 16px;
  background: rgba(255,255,255,.14);
}
.pickup-eyebrow, .pickup-section-kicker {
  display: block;
  color: #70d9c9;
  font-size: .67rem;
  font-weight: 850;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.pickup-hero .pickup-eyebrow { color: #c5fff5; }
.pickup-hero h1 { margin: .15rem 0 .22rem; font-size: clamp(1.25rem, 2vw, 1.75rem); font-weight: 850; letter-spacing: -.03em; }
.pickup-hero p { max-width: 650px; margin: 0; color: rgba(255,255,255,.78); font-size: .8rem; }
.pickup-hero-badge {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  gap: .45rem;
  padding: .55rem .75rem;
  color: #fff;
  font-size: .7rem;
  font-weight: 800;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  background: rgba(255,255,255,.12);
}
.pickup-hero-badge i { color: #ffe6a9; font-size: .9rem; }
.pickup-alert {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  margin-bottom: 1rem;
  padding: .75rem .9rem;
  color: #991b1b;
  font-size: .78rem;
  font-weight: 650;
  border: 1px solid #fecaca;
  border-radius: .9rem;
  background: #fff5f5;
}
.pickup-alert > i { margin-top: .1rem; font-size: .95rem; }
.pickup-workspace { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(320px, .78fr); align-items: start; gap: 1rem; }
.pickup-form-card, .pickup-current-card, .pickup-empty-card {
  min-width: 0;
  border: 1px solid var(--pickup-line);
  border-radius: 1.15rem;
  background: #fff;
  box-shadow: 0 10px 28px rgba(15, 23, 42, .055);
}
.pickup-form-card { overflow: hidden; }
.pickup-card-heading, .pickup-current-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.15rem 1.2rem;
  border-bottom: 1px solid var(--pickup-line);
  background: linear-gradient(135deg, #f6fffd, #fff);
}
.pickup-card-heading h2, .pickup-current-heading h2 { margin: .18rem 0 .25rem; color: var(--pickup-ink); font-size: 1.15rem; font-weight: 850; }
.pickup-card-heading p { max-width: 540px; margin: 0; color: var(--pickup-muted); font-size: .75rem; }
.pickup-heading-mark {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  color: var(--pickup-teal);
  border-radius: 12px;
  background: var(--pickup-teal-soft);
}
.pickup-form { padding: 0 1.2rem; }
.pickup-form-section { padding: 1.15rem 0; border-bottom: 1px solid var(--pickup-line); }
.pickup-form-section:last-of-type { border-bottom: 0; }
.pickup-form-section-title { display: flex; align-items: center; gap: .7rem; margin-bottom: .9rem; }
.pickup-section-icon {
  display: grid;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  place-items: center;
  color: var(--pickup-teal);
  border-radius: 10px;
  background: var(--pickup-teal-soft);
}
.pickup-section-icon-route { color: #ae6b09; background: var(--pickup-gold-soft); }
.pickup-section-icon-rider { color: #5b50b5; background: #f0efff; }
.pickup-form-section-title h3 { margin: 0 0 .12rem; color: var(--pickup-ink); font-size: .9rem; font-weight: 850; }
.pickup-form-section-title p { margin: 0; color: var(--pickup-muted); font-size: .7rem; }
.pickup-field-grid { display: grid; gap: .75rem; }
.pickup-field-grid-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pickup-field-label { display: block; margin-bottom: .35rem; color: #526174; font-size: .7rem; font-weight: 800; }
.pickup-field-label span { color: #9aa8b8; font-weight: 650; }
.pickup-input-wrap, .pickup-rider-select-wrap { position: relative; }
.pickup-input-wrap > i, .pickup-rider-select-wrap > i { position: absolute; z-index: 1; top: 50%; left: .75rem; color: #93a2b3; font-size: .85rem; pointer-events: none; transform: translateY(-50%); }
.pickup-input-wrap .form-control, .pickup-rider-select-wrap .form-select { padding-left: 2.1rem; }
.pickup-page .form-control, .pickup-page .form-select { min-height: 42px; color: var(--pickup-ink); font-size: .78rem; border-color: #dfe8ee; border-radius: .7rem; box-shadow: none; }
.pickup-page textarea.form-control { min-height: 82px; resize: vertical; }
.pickup-page .form-control::placeholder { color: #a6b1bd; }
.pickup-page .form-control:focus, .pickup-page .form-select:focus { border-color: #72c4b8; box-shadow: 0 0 0 .2rem rgba(15, 118, 110, .1); }
.pickup-field-notes { margin-top: .8rem; }
.pickup-item-photo-field { margin-top: .85rem; }
.pickup-photo-upload-box { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .8rem; padding: .75rem; border: 1px dashed #9ed8ce; border-radius: .8rem; background: #f5fffc; }
.pickup-photo-upload-copy { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.pickup-photo-upload-copy > i { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; color: var(--pickup-teal); border-radius: 10px; background: #d8f5ee; }
.pickup-photo-upload-copy strong, .pickup-photo-upload-copy small { display: block; }
.pickup-photo-upload-copy strong { color: var(--pickup-ink); font-size: .72rem; font-weight: 800; }
.pickup-photo-upload-copy small { margin-top: .15rem; color: #7a8d92; font-size: .63rem; }
.pickup-photo-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .4rem; }
.pickup-photo-file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.pickup-photo-actions .btn { min-height: 36px; padding: .48rem .65rem; border-radius: .6rem; font-size: .66rem; font-weight: 800; }
.pickup-take-photo-btn { color: #fff; border-color: var(--pickup-teal); background: var(--pickup-teal); }
.pickup-take-photo-btn:hover, .pickup-take-photo-btn:focus { color: #fff; background: #0b625c; }
.pickup-choose-photo-btn { color: var(--pickup-teal); border: 1px solid #9ed8ce; background: #fff; cursor: pointer; }
.pickup-choose-photo-btn:hover, .pickup-choose-photo-btn:focus { color: #0b625c; background: #f0fdfa; }
.pickup-camera-modal { position: fixed; z-index: 1080; inset: 0; display: grid; place-items: center; padding: 1rem; background: rgba(15,23,42,.7); }
.pickup-camera-modal[hidden] { display: none; }
.pickup-camera-card { width: min(520px, 100%); overflow: hidden; border: 1px solid #dce8eb; border-radius: 1rem; background: #fff; box-shadow: 0 24px 60px rgba(15,23,42,.28); }
.pickup-camera-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: .95rem 1rem; border-bottom: 1px solid #e5edf0; }
.pickup-camera-heading h3 { margin: .18rem 0 0; color: var(--pickup-ink); font-size: .95rem; font-weight: 850; }
.pickup-camera-frame { position: relative; min-height: 260px; overflow: hidden; background: #0f172a; }
.pickup-camera-frame video { display: block; width: 100%; min-height: 260px; max-height: 55vh; object-fit: cover; transform: scaleX(-1); }
.pickup-camera-placeholder { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: .55rem; padding: 1rem; color: #dbeafe; text-align: center; font-size: .72rem; }
.pickup-camera-placeholder[hidden] { display: none; }
.pickup-camera-placeholder i { font-size: 2rem; }
.pickup-camera-status { min-height: 36px; padding: .7rem 1rem 0; color: #718096; font-size: .68rem; line-height: 1.4; }
.pickup-camera-actions { display: flex; justify-content: flex-end; gap: .5rem; padding: .75rem 1rem 1rem; }
.pickup-camera-actions .btn { min-height: 40px; font-size: .7rem; font-weight: 800; }
.pickup-item-photo-preview { display: block; width: 72px; height: 72px; object-fit: cover; border: 1px solid #bfe4dc; border-radius: .65rem; }
.pickup-item-photo-field .form-text { color: #8a9b9e; font-size: .62rem; }
.pickup-priority-field { margin-top: .9rem; padding: .8rem; border: 1px solid #e5ebef; border-radius: .8rem; background: #fbfcfd; }
.pickup-priority-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.pickup-priority-heading small { display: block; margin-top: .16rem; color: #8a9b9e; font-size: .63rem; }
.pickup-priority-heading > i { color: #c47a0a; font-size: 1rem; }
.pickup-priority-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; margin-top: .7rem; }
.pickup-priority-option { display: flex; align-items: center; gap: .55rem; min-width: 0; padding: .65rem .7rem; border: 1px solid #e1e9ed; border-radius: .7rem; background: #fff; cursor: pointer; }
.pickup-priority-option:has(input:checked) { border-color: #6fc5b6; background: #f0fdfa; box-shadow: 0 0 0 .15rem rgba(15,118,110,.07); }
.pickup-priority-option-priority:has(input:checked) { border-color: #e8bf72; background: #fffaf0; box-shadow: 0 0 0 .15rem rgba(196,122,10,.07); }
.pickup-priority-option input { flex: 0 0 auto; accent-color: var(--pickup-teal); }
.pickup-priority-option span { min-width: 0; flex: 1 1 auto; }
.pickup-priority-option strong, .pickup-priority-option small { display: block; }
.pickup-priority-option strong { color: var(--pickup-ink); font-size: .7rem; font-weight: 800; }
.pickup-priority-option small { margin-top: .15rem; color: #7a8d92; font-size: .6rem; line-height: 1.35; }
.pickup-priority-option b { flex: 0 0 auto; color: var(--pickup-teal); font-size: .62rem; white-space: nowrap; }
.pickup-priority-option-priority b { color: #ae6b09; }
.pickup-price-preview { display: flex; align-items: center; gap: .65rem; margin-top: .85rem; padding: .75rem .85rem; border: 1px solid #cfece5; border-radius: .8rem; background: linear-gradient(135deg, #f0fdfa, #fbfffe); }
.pickup-price-preview-icon { display: grid; width: 32px; height: 32px; flex: 0 0 32px; place-items: center; color: var(--pickup-teal); border-radius: 9px; background: #ccfbf1; }
.pickup-price-preview > div { min-width: 0; }
.pickup-price-preview span:not(.pickup-price-preview-icon), .pickup-price-preview strong, .pickup-price-preview small { display: block; }
.pickup-price-preview span:not(.pickup-price-preview-icon) { color: #638079; font-size: .64rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.pickup-price-preview strong { margin-top: .1rem; color: var(--pickup-teal); font-size: 1.05rem; font-weight: 850; }
.pickup-price-preview small { margin-top: .1rem; color: #8a9b9e; font-size: .62rem; }
.pickup-route-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.pickup-route-field { padding: .75rem; border: 1px solid #e5ebef; border-radius: .8rem; background: #fbfcfd; }
.pickup-route-field .pickup-field-label { display: flex; align-items: center; gap: .45rem; }
.pickup-route-dot { display: inline-block; flex: 0 0 9px; width: 9px; height: 9px; border-radius: 50%; }
.pickup-route-pickup .pickup-route-dot { background: var(--pickup-gold); box-shadow: 0 0 0 3px #fff0d1; }
.pickup-route-destination .pickup-route-dot { background: var(--pickup-teal); box-shadow: 0 0 0 3px #d6f6ef; }
.pickup-map-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: .85rem; }
.pickup-map-card { padding: .65rem; border: 1px solid #e5ebef; border-radius: .85rem; background: #f8fafb; }
.pickup-map-heading { display: flex; align-items: center; gap: .55rem; margin: .05rem .05rem .55rem; }
.pickup-map-heading > div { min-width: 0; }
.pickup-map-heading strong, .pickup-map-heading span { display: block; }
.pickup-map-heading strong { color: var(--pickup-ink); font-size: .73rem; font-weight: 850; }
.pickup-map-heading span { margin-top: .12rem; color: #8b98a6; font-size: .62rem; }
.pickup-map-icon { display: grid; flex: 0 0 29px; width: 29px; height: 29px; place-items: center; border-radius: 9px; }
.pickup-map-icon-pickup { color: #a96508; background: #ffedc8; }
.pickup-map-icon-destination { color: var(--pickup-teal); background: #d8f5ee; }
.pickup-map { height: 235px; overflow: hidden; border: 1px solid #dce5e8; border-radius: .65rem; }
.pickup-map .leaflet-control-attribution { font-size: 8px; }
.pickup-rider-select-wrap { max-width: 560px; }
.pickup-rider-flow-note { display: flex; align-items: flex-start; gap: .65rem; padding: .8rem .85rem; border: 1px solid #d9e8f0; border-radius: .8rem; background: #f5fbff; }
.pickup-rider-flow-note > i { color: #2563eb; font-size: 1rem; }
.pickup-rider-flow-note strong, .pickup-rider-flow-note span { display: block; }
.pickup-rider-flow-note strong { color: #24506b; font-size: .75rem; }
.pickup-rider-flow-note span { margin-top: .12rem; color: #718096; font-size: .68rem; line-height: 1.4; }
.pickup-form-footer { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: 1rem 0 1.15rem; }
.pickup-form-footer > div { display: flex; align-items: center; gap: .4rem; color: #8b98a6; font-size: .68rem; }
.pickup-form-footer > div i { color: var(--pickup-teal); }
.pickup-submit-btn { color: #fff; font-size: .76rem; font-weight: 800; border: 0; border-radius: .7rem; background: var(--pickup-teal); box-shadow: 0 8px 16px rgba(15, 118, 110, .18); }
.pickup-submit-btn:hover, .pickup-submit-btn:focus { color: #fff; background: #0b625c; }
.pickup-sidebar { min-width: 0; }
.pickup-current-card { position: sticky; top: 1rem; overflow: hidden; }
.pickup-current-heading { padding: 1rem 1.05rem .8rem; background: linear-gradient(135deg, #fffaf0, #fff); }
.pickup-current-heading h2 { font-size: 1rem; }
.pickup-status-badge { flex: 0 0 auto; padding-top: .1rem; }
.pickup-status-badge .badge { font-size: .64rem; }
.pickup-current-subtitle { margin: -.25rem 1.05rem .9rem; color: var(--pickup-muted); font-size: .7rem; }
.pickup-detail-list { display: grid; gap: .55rem; padding: 0 1.05rem; }
.pickup-detail-row { display: flex; align-items: flex-start; gap: .6rem; min-width: 0; padding: .6rem; border: 1px solid #edf1f3; border-radius: .7rem; background: #fbfcfd; }
.pickup-detail-icon { display: grid; flex: 0 0 29px; width: 29px; height: 29px; place-items: center; color: #748293; border-radius: 9px; background: #eef2f5; }
.pickup-detail-icon-pickup { color: #ae6b09; background: #fff0d1; }
.pickup-detail-icon-destination { color: var(--pickup-teal); background: #d9f6ef; }
.pickup-detail-row > div { min-width: 0; }
.pickup-detail-row span:not(.pickup-detail-icon), .pickup-detail-row strong { display: block; }
.pickup-detail-row span:not(.pickup-detail-icon) { margin-bottom: .13rem; color: #94a1af; font-size: .62rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.pickup-detail-row strong { overflow: hidden; color: var(--pickup-ink); font-size: .73rem; line-height: 1.35; text-overflow: ellipsis; }
.pickup-detail-row .pickup-total { color: var(--pickup-teal); font-size: .88rem; }
.pickup-handoff-pin { background: #f0f9ff; border-color: #bae6fd; }
.pickup-handoff-pin .pickup-detail-icon { color: #0369a1; background: #e0f2fe; }
.pickup-handoff-pin strong { color: #0369a1 !important; font-size: .98rem !important; letter-spacing: .18em; }
.pickup-handoff-pin small { display: block; margin-top: .2rem; color: #52626f; font-size: .65rem; }
.pickup-priority-detail { background: #fffaf0; border-color: #f1dfb8; }
.pickup-priority-detail .pickup-detail-icon { color: #ae6b09; background: #ffedc8; }
.pickup-item-photo-detail img { display: block; width: 90px; height: 90px; margin-top: .35rem; object-fit: cover; border: 1px solid #dce8eb; border-radius: .65rem; }
.pickup-handoff-qr-code { display: block; flex: 0 0 132px; width: 132px; height: 132px; margin-left: auto; padding: .3rem; background: #fff; border: 1px solid #bae6fd; border-radius: .65rem; }
.pickup-rider-card { margin: .85rem 1.05rem 0; padding: .75rem; border: 1px solid #e4eff1; border-radius: .8rem; background: linear-gradient(135deg, #f4fffd, #fbfcfd); }
.pickup-rider-card-heading { display: flex; align-items: center; gap: .55rem; }
.pickup-rider-card-heading > div { min-width: 0; }
.pickup-rider-card-heading span, .pickup-rider-card-heading strong { display: block; }
.pickup-rider-card-heading span { color: #94a1af; font-size: .62rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.pickup-rider-card-heading strong { margin-top: .1rem; overflow: hidden; color: var(--pickup-ink); font-size: .76rem; text-overflow: ellipsis; }
.pickup-rider-schedule { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem; margin: .6rem 0 0 2.15rem; color: #718096; font-size: .67rem; }
.pickup-rider-schedule i { color: var(--pickup-teal); }
.pickup-rider-schedule .badge { font-size: .58rem; }
.pickup-rider-unassigned { color: #9a6a20; }
.pickup-rider-unassigned i { color: var(--pickup-gold); }
.pickup-call-btn { width: 100%; margin-top: .65rem; color: #13795b; font-size: .68rem; font-weight: 750; border-color: #9ed8c4; }
.pickup-call-btn:hover { color: #fff; background: #198754; }
.pickup-current-meta { display: grid; gap: .35rem; margin: .8rem 1.05rem; color: #8b98a6; font-size: .64rem; }
.pickup-current-meta > span { display: flex; align-items: center; gap: .15rem; }
.pickup-current-meta .badge { margin-left: .15rem; font-size: .58rem; }
.pickup-card-actions { display: grid; grid-template-columns: 1.2fr .8fr; gap: .5rem; padding: 0 1.05rem 1.05rem; }
.pickup-card-actions .btn, .pickup-assign-form .btn { font-size: .7rem; font-weight: 800; border-radius: .65rem; }
.pickup-assign-panel { margin: 0 1.05rem 1.05rem; padding: .85rem; border-top: 1px solid var(--pickup-line); border-radius: .75rem; background: #fbfcfd; }
.pickup-assign-panel strong { display: block; margin-top: .12rem; color: var(--pickup-ink); font-size: .78rem; }
.pickup-assign-form { display: grid; gap: .55rem; margin-top: .65rem; }
.pickup-assign-form .form-select { min-height: 39px; font-size: .7rem; }
.pickup-empty-card { padding: 2rem 1.25rem; text-align: center; }
.pickup-empty-icon { display: grid; width: 64px; height: 64px; margin: 0 auto 1rem; place-items: center; color: #b77712; font-size: 1.65rem; border-radius: 50%; background: var(--pickup-gold-soft); }
.pickup-empty-card h2 { margin: .25rem 0 .4rem; color: var(--pickup-ink); font-size: 1.05rem; font-weight: 850; }
.pickup-empty-card p { margin: 0 auto 1rem; color: var(--pickup-muted); font-size: .74rem; line-height: 1.55; }
.pickup-empty-tip { display: flex; align-items: center; gap: .5rem; margin-top: .5rem; padding: .6rem .7rem; color: #607080; text-align: left; font-size: .67rem; border: 1px solid #edf1f3; border-radius: .65rem; background: #fbfcfd; }
.pickup-empty-tip i { color: var(--pickup-teal); font-size: .85rem; }
.rider-priority-badge { color: #7a4b00; border: 1px solid #f0c36d; background: #fff1cf; }
.rider-pickup-photo { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin: .75rem 0; padding: .65rem .75rem; border: 1px solid #f1dfb8; border-radius: .75rem; background: #fffaf0; }
.rider-pickup-photo > div span, .rider-pickup-photo > div small { display: block; }
.rider-pickup-photo > div span { color: #855b19; font-size: .7rem; font-weight: 800; }
.rider-pickup-photo > div small { margin-top: .15rem; color: #9a835d; font-size: .62rem; }
.rider-pickup-photo a { display: flex; align-items: center; gap: .45rem; color: #8a5a0a; font-size: .64rem; font-weight: 800; text-decoration: none; }
.rider-pickup-photo a:hover { text-decoration: underline; }
.rider-pickup-photo img { width: 48px; height: 48px; object-fit: cover; border: 1px solid #e8c982; border-radius: .55rem; }
.rider-manage-photo-detail a { display: inline-flex; align-items: center; gap: .55rem; margin-top: .3rem; color: var(--ce-primary); text-decoration: none; }
.rider-manage-photo-detail a:hover { text-decoration: underline; }
.rider-manage-photo-detail img { width: 58px; height: 58px; object-fit: cover; border: 1px solid #d8e7eb; border-radius: .55rem; }

@media (max-width: 991.98px) {
  .pickup-workspace { grid-template-columns: 1fr; }
  .pickup-current-card { position: static; }
  .pickup-sidebar { order: -1; }
}

@media (max-width: 575.98px) {
  .pickup-page { padding-top: .75rem !important; }
  .pickup-hero { align-items: flex-start; flex-direction: column; padding: 1rem; border-radius: 1rem; }
  .pickup-hero-badge { align-self: flex-start; }
  .pickup-hero-icon { flex-basis: 43px; width: 43px; height: 43px; border-radius: 13px; }
  .pickup-hero p { font-size: .73rem; }
  .pickup-card-heading, .pickup-current-heading { padding: .95rem; }
  .pickup-form { padding: 0 .95rem; }
  .pickup-field-grid-two, .pickup-route-grid, .pickup-map-grid { grid-template-columns: 1fr; }
  .pickup-photo-upload-box { grid-template-columns: 1fr; }
  .pickup-photo-actions { justify-content: flex-start; }
  .pickup-priority-options { grid-template-columns: 1fr; }
  .pickup-map { height: 220px; }
  .pickup-form-footer { align-items: stretch; flex-direction: column; }
  .pickup-form-footer > div { justify-content: center; }
  .pickup-submit-btn { width: 100%; }
  .pickup-detail-list { padding: 0 .95rem; }
  .pickup-rider-card { margin-right: .95rem; margin-left: .95rem; }
  .pickup-current-meta { margin-right: .95rem; margin-left: .95rem; }
  .pickup-card-actions { padding-right: .95rem; padding-left: .95rem; }
  .pickup-assign-panel { margin-right: .95rem; margin-left: .95rem; }
}

/* Profile settings */
.profile-page {
  --profile-ink: #172033;
  --profile-muted: #718096;
  --profile-line: #e5edf1;
  --profile-teal: #0f766e;
  --profile-teal-soft: #e7f8f4;
  max-width: 1120px;
}
.profile-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1.25rem 1.35rem;
  color: #fff;
  border-radius: 1.2rem;
  background: radial-gradient(circle at 86% 12%, rgba(255,255,255,.16), transparent 28%), linear-gradient(120deg, #12324a, #0f766e 72%, #e8a33d 160%);
  box-shadow: 0 14px 30px rgba(15, 118, 110, .14);
}
.profile-hero-copy { display: flex; align-items: center; gap: .85rem; min-width: 0; }
.profile-avatar { display: grid; flex: 0 0 52px; width: 52px; height: 52px; place-items: center; font-size: 1.4rem; border: 1px solid rgba(255,255,255,.2); border-radius: 16px; background: rgba(255,255,255,.13); }
.profile-eyebrow, .profile-section-kicker { display: block; color: #71d9cb; font-size: .66rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.profile-hero .profile-eyebrow { color: #c4fff5; }
.profile-hero h1 { margin: .15rem 0 .2rem; font-size: 1.65rem; font-weight: 850; letter-spacing: -.03em; }
.profile-hero p { margin: 0; color: rgba(255,255,255,.76); font-size: .76rem; }
.profile-role-badge { display: inline-flex; align-items: center; flex: 0 0 auto; gap: .4rem; padding: .55rem .75rem; color: #fff; font-size: .69rem; font-weight: 800; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; background: rgba(255,255,255,.12); }
.profile-role-badge i { color: #ffe4a8; }
.profile-layout { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr); align-items: start; gap: 1rem; }
.profile-form-card, .profile-documents-card { min-width: 0; overflow: hidden; border: 1px solid var(--profile-line); border-radius: 1.1rem; background: #fff; box-shadow: 0 10px 28px rgba(15, 23, 42, .055); }
.profile-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .85rem; padding: 1.1rem 1.2rem; border-bottom: 1px solid var(--profile-line); background: linear-gradient(135deg, #f6fffd, #fff); }
.profile-card-heading h2 { margin: .16rem 0 .22rem; color: var(--profile-ink); font-size: 1.08rem; font-weight: 850; }
.profile-card-heading p { max-width: 480px; margin: 0; color: var(--profile-muted); font-size: .72rem; }
.profile-email-verification { display: flex; align-items: flex-start; gap: .75rem; margin: 1rem 1.2rem 0; padding: .85rem; border: 1px solid #b9e7df; border-radius: .85rem; background: #f1fffc; }
.profile-email-verification-icon { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; color: var(--profile-teal); border-radius: 10px; background: #d9f7f0; }
.profile-email-verification-copy { min-width: 0; flex: 1 1 auto; }
.profile-email-verification-copy > strong, .profile-email-verification-copy > span { display: block; }
.profile-email-verification-copy > strong { color: var(--profile-ink); font-size: .78rem; }
.profile-email-verification-copy > span { margin-top: .18rem; color: var(--profile-muted); font-size: .68rem; line-height: 1.5; }
.profile-email-verification-form { max-width: 430px; margin-top: .65rem; }
.profile-email-verification-form .form-control { min-height: 38px; }
.profile-email-verification-form .btn { font-size: .7rem; font-weight: 800; }
.profile-pending-name-note { margin-top: .55rem; padding: .55rem .65rem; color: #8a641d; font-size: .68rem; border: 1px solid #f1dfb5; border-radius: .65rem; background: #fffaf0; }
.profile-heading-icon { display: grid; flex: 0 0 37px; width: 37px; height: 37px; place-items: center; color: var(--profile-teal); border-radius: 11px; background: var(--profile-teal-soft); }
.profile-documents-icon { color: #a66b12; background: #fff4df; }
.profile-form { padding: 1.15rem 1.2rem 1.2rem; }
.profile-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-top: .9rem; }
.profile-field-group { min-width: 0; }
.profile-field-label { display: block; margin-bottom: .35rem; color: #526174; font-size: .7rem; font-weight: 800; }
.profile-name-grid { display: grid; grid-template-columns: 1fr .55fr 1fr; gap: .55rem; }
.profile-input-wrap { position: relative; }
.profile-input-wrap > i { position: absolute; z-index: 1; top: 50%; left: .75rem; color: #93a2b3; font-size: .82rem; pointer-events: none; transform: translateY(-50%); }
.profile-input-wrap .form-control { padding-left: 2.05rem; }
.profile-page .form-control { min-height: 42px; color: var(--profile-ink); font-size: .77rem; border-color: #dfe8ee; border-radius: .68rem; box-shadow: none; }
.profile-page .form-control:focus { border-color: #72c4b8; box-shadow: 0 0 0 .2rem rgba(15, 118, 110, .1); }
.profile-page .form-text { color: #96a3b0; font-size: .65rem; }
.profile-form-footer { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-top: 1.15rem; padding-top: 1rem; border-top: 1px solid var(--profile-line); }
.profile-form-footer > span { color: #8c99a7; font-size: .67rem; }
.profile-form-footer > span i { color: var(--profile-teal); }
.profile-save-btn { color: #fff; font-size: .74rem; font-weight: 800; border: 0; border-radius: .68rem; background: var(--profile-teal); box-shadow: 0 7px 15px rgba(15, 118, 110, .17); }
.profile-save-btn:hover, .profile-save-btn:focus { color: #fff; background: #0b625c; }
.profile-documents-heading { background: linear-gradient(135deg, #fffaf0, #fff); }
.profile-documents-body { padding: 1rem 1.1rem 1.1rem; }
.profile-student-id { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-bottom: .85rem; padding: .65rem .7rem; color: #77612d; font-size: .68rem; border: 1px solid #f2e3bf; border-radius: .7rem; background: #fffaf0; }
.profile-student-id strong { color: var(--profile-ink); font-size: .76rem; }
.profile-document-group-title { margin: .75rem .1rem .45rem; color: #9b7a3e; font-size: .63rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.profile-document-group-title:first-child { margin-top: 0; }
.profile-document-link { display: flex; align-items: center; gap: .6rem; margin-top: .45rem; padding: .6rem; color: inherit; text-decoration: none; border: 1px solid #edf1f3; border-radius: .72rem; background: #fbfcfd; transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease; }
.profile-document-link:hover { color: inherit; border-color: #a9dcd4; box-shadow: 0 5px 15px rgba(15, 118, 110, .08); transform: translateY(-1px); }
.profile-document-icon { display: grid; flex: 0 0 31px; width: 31px; height: 31px; place-items: center; color: var(--profile-teal); border-radius: 9px; background: var(--profile-teal-soft); }
.profile-document-copy { min-width: 0; flex: 1 1 auto; }
.profile-document-copy strong, .profile-document-copy small { display: block; }
.profile-document-copy strong { overflow: hidden; color: var(--profile-ink); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.profile-document-copy small { margin-top: .1rem; color: #98a4af; font-size: .62rem; }
.profile-document-arrow { color: #9aa7b2; font-size: .78rem; }
.profile-documents-empty { padding: 1.5rem .8rem .7rem; text-align: center; }
.profile-documents-empty > div { display: grid; width: 52px; height: 52px; margin: 0 auto .7rem; place-items: center; color: #b27a24; font-size: 1.35rem; border-radius: 50%; background: #fff4df; }
.profile-documents-empty strong, .profile-documents-empty span { display: block; }
.profile-documents-empty strong { color: var(--profile-ink); font-size: .78rem; }
.profile-documents-empty span { margin-top: .3rem; color: var(--profile-muted); font-size: .67rem; line-height: 1.5; }

@media (max-width: 767.98px) {
  .profile-layout { grid-template-columns: 1fr; }
  .profile-documents-card { order: -1; }
}

@media (max-width: 575.98px) {
  .profile-page { padding-top: .75rem !important; }
  .profile-hero { align-items: flex-start; flex-direction: column; padding: 1rem; border-radius: 1rem; }
  .profile-avatar { flex-basis: 43px; width: 43px; height: 43px; border-radius: 13px; }
  .profile-hero h1 { font-size: 1.3rem; }
  .profile-hero p { font-size: .7rem; line-height: 1.45; }
  .profile-card-heading, .profile-form { padding-right: .95rem; padding-left: .95rem; }
  .profile-email-verification { margin-right: .95rem; margin-left: .95rem; }
  .profile-field-grid, .profile-name-grid { grid-template-columns: 1fr; }
  .profile-form-footer { align-items: stretch; flex-direction: column; }
  .profile-form-footer > span { text-align: center; }
  .profile-save-btn { width: 100%; }
  .profile-documents-body { padding-right: .95rem; padding-left: .95rem; }
}

/* Seller workspace pages */
.seller-page {
  --seller-ink: #172033;
  --seller-muted: #718096;
  --seller-line: #e5edf1;
  --seller-teal: #0f766e;
  --seller-teal-soft: #e7f8f4;
  max-width: 1180px;
}
.seller-page-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1.25rem 1.35rem;
  color: #fff;
  border-radius: 1.2rem;
  background: radial-gradient(circle at 88% 12%, rgba(255,255,255,.16), transparent 27%), linear-gradient(120deg, #122e42, #0f766e 70%, #e8a33d 160%);
  box-shadow: 0 14px 30px rgba(15, 118, 110, .14);
}
.seller-hero-copy { display: flex; align-items: center; gap: .9rem; min-width: 0; }
.seller-hero-icon { display: grid; flex: 0 0 52px; width: 52px; height: 52px; place-items: center; color: #fff; font-size: 1.45rem; border: 1px solid rgba(255,255,255,.2); border-radius: 16px; background: rgba(255,255,255,.13); }
.seller-hero-kicker, .seller-section-kicker { display: block; color: #70d9c9; font-size: .65rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.seller-hero-kicker { color: #c4fff5; }
.seller-page-hero h1 { margin: .14rem 0 .2rem; font-size: clamp(1.3rem, 2vw, 1.75rem); font-weight: 850; letter-spacing: -.03em; }
.seller-page-hero p { max-width: 670px; margin: 0; color: rgba(255,255,255,.76); font-size: .76rem; }
.seller-hero-action, .seller-hero-note { display: inline-flex; align-items: center; flex: 0 0 auto; gap: .35rem; border-radius: .7rem; }
.seller-hero-action { padding: .58rem .8rem; color: #183044; font-size: .73rem; font-weight: 850; background: #fff; box-shadow: 0 7px 16px rgba(0,0,0,.12); }
.seller-hero-action:hover { color: #183044; background: #f2fffc; }
.seller-hero-note { padding: .55rem .75rem; color: #fff; font-size: .68rem; font-weight: 800; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.11); }
.seller-hero-note i { color: #ffe6a9; }
.seller-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin-bottom: 1rem; }
.seller-stat-card { display: flex; align-items: center; gap: .7rem; min-width: 0; padding: .85rem; border: 1px solid var(--seller-line); border-radius: .95rem; background: #fff; box-shadow: 0 7px 20px rgba(15,23,42,.045); }
.seller-stat-icon { display: grid; flex: 0 0 37px; width: 37px; height: 37px; place-items: center; font-size: .95rem; border-radius: 11px; }
.seller-stat-card > div { min-width: 0; }
.seller-stat-card > div > span, .seller-stat-card small { display: block; }
.seller-stat-card > div > span { color: #7b8997; font-size: .63rem; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.seller-stat-card strong { display: block; overflow: hidden; margin: .1rem 0 .05rem; color: var(--seller-ink); font-size: 1.12rem; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.seller-stat-card small { overflow: hidden; color: #9aa6b2; font-size: .62rem; text-overflow: ellipsis; white-space: nowrap; }
.seller-stat-teal .seller-stat-icon { color: #0f766e; background: #dff8f1; }
.seller-stat-blue .seller-stat-icon { color: #2563a8; background: #e5f1ff; }
.seller-stat-gold .seller-stat-icon { color: #aa6d0f; background: #fff1d5; }
.seller-stat-red .seller-stat-icon { color: #b4433a; background: #ffebe9; }
.seller-stat-violet .seller-stat-icon { color: #6655b7; background: #efedff; }
.seller-content-card { min-width: 0; overflow: hidden; border: 1px solid var(--seller-line); border-radius: 1.05rem; background: #fff; box-shadow: 0 9px 25px rgba(15,23,42,.05); }
.seller-content-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; padding: 1.05rem 1.15rem; border-bottom: 1px solid var(--seller-line); background: linear-gradient(135deg, #f6fffd, #fff); }
.seller-content-heading h2 { margin: .16rem 0 .2rem; color: var(--seller-ink); font-size: 1.02rem; font-weight: 850; }
.seller-content-heading p { margin: 0; color: var(--seller-muted); font-size: .7rem; }
.seller-count-chip { flex: 0 0 auto; padding: .45rem .6rem; color: var(--seller-teal); font-size: .64rem; font-weight: 800; border-radius: 999px; background: var(--seller-teal-soft); }
.seller-heading-icon { display: grid; flex: 0 0 36px; width: 36px; height: 36px; place-items: center; color: var(--seller-teal); border-radius: 11px; background: var(--seller-teal-soft); }
.seller-map-heading-icon { color: #a66b12; background: #fff3dd; }
.seller-content-card .table { --bs-table-bg: transparent; }
.seller-content-card .table thead th { padding: .72rem 1rem; color: #8a98a5; font-size: .61rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; border-bottom: 1px solid var(--seller-line); background: #fbfcfd; }
.seller-content-card .table tbody td { padding: .75rem 1rem; color: #536274; font-size: .74rem; border-color: #eef2f4; }
.seller-content-card .table tbody tr:last-child td { border-bottom: 0; }
.seller-content-card .table tbody tr:hover { background: #fbfefd; }
.seller-product-cell, .seller-customer-cell { display: flex; align-items: center; gap: .65rem; min-width: 210px; }
.seller-product-image { display: grid; flex: 0 0 46px; width: 46px; height: 46px; place-items: center; color: #8795a3; object-fit: cover; border: 1px solid #e5ecef; border-radius: 12px; background: #f5f8f9; }
.seller-product-placeholder { font-size: 1rem; }
.seller-product-copy { min-width: 0; }
.seller-product-copy strong, .seller-product-copy small { display: block; }
.seller-product-copy strong { overflow: hidden; color: var(--seller-ink); font-size: .77rem; text-overflow: ellipsis; white-space: nowrap; }
.seller-product-copy small { max-width: 270px; margin-top: .15rem; overflow: hidden; color: #96a3af; font-size: .64rem; text-overflow: ellipsis; white-space: nowrap; }
.seller-category-chip, .seller-order-type { display: inline-flex; align-items: center; padding: .34rem .5rem; color: #607080; font-size: .65rem; font-weight: 750; border-radius: 999px; background: #f2f5f7; }
.seller-price { color: var(--seller-teal); font-size: .82rem; white-space: nowrap; }
.seller-stock-badge { display: inline-flex; align-items: center; white-space: nowrap; padding: .34rem .5rem; font-size: .63rem; font-weight: 800; border-radius: 999px; }
.seller-stock-badge.is-ready { color: #16705b; background: #e6f8f1; }
.seller-stock-badge.is-low { color: #9b6414; background: #fff3d9; }
.seller-stock-badge.is-empty { color: #a33d37; background: #ffebea; }
.seller-table-actions { min-width: 160px; white-space: nowrap; }
.seller-table-actions .btn { margin: .1rem; font-size: .65rem; font-weight: 800; border-radius: .55rem; }
.seller-table-empty, .seller-report-empty { display: flex; align-items: center; flex-direction: column; gap: .2rem; padding: 2rem 1rem; text-align: center; }
.seller-table-empty > span { display: grid; width: 48px; height: 48px; margin-bottom: .25rem; place-items: center; color: var(--seller-teal); font-size: 1.3rem; border-radius: 50%; background: var(--seller-teal-soft); }
.seller-table-empty strong, .seller-report-empty strong { color: var(--seller-ink); font-size: .78rem; }
.seller-table-empty small, .seller-report-empty span { color: #96a3af; font-size: .66rem; }
.seller-table-empty .btn { margin-top: .5rem; font-size: .68rem; }
.seller-order-number { color: #657588; font-size: .7rem; font-weight: 850; }
.seller-customer-avatar { display: grid; flex: 0 0 29px; width: 29px; height: 29px; place-items: center; color: #5b50b5; border-radius: 9px; background: #efedff; }
.seller-customer-cell strong { color: var(--seller-ink); font-size: .72rem; }
.seller-order-type { color: #607080; }
.seller-date-cell { color: #83909e; font-size: .64rem; white-space: nowrap; }
.seller-store-layout { display: grid; grid-template-columns: minmax(320px, .8fr) minmax(0, 1.2fr); align-items: stretch; gap: 1rem; }
.seller-store-form-card, .seller-map-card { height: 100%; }
.seller-store-form { display: grid; gap: .9rem; padding: 1.15rem; }
.seller-field-label { display: block; margin-bottom: .35rem; color: #526174; font-size: .7rem; font-weight: 800; }
.seller-input-wrap { position: relative; }
.seller-input-wrap > i, .seller-input-wrap > .seller-currency-symbol { position: absolute; z-index: 1; top: 50%; left: .75rem; color: #93a2b3; font-size: .82rem; pointer-events: none; transform: translateY(-50%); }
.seller-input-wrap .form-control { padding-left: 2.05rem; }
.seller-page .form-control { color: var(--seller-ink); font-size: .76rem; border-color: #dfe8ee; border-radius: .68rem; box-shadow: none; }
.seller-page .form-control:focus { border-color: #72c4b8; box-shadow: 0 0 0 .2rem rgba(15,118,110,.1); }
.seller-page textarea.form-control { resize: vertical; }
.seller-page .form-text { color: #98a4af; font-size: .64rem; }
.seller-location-note { display: flex; align-items: flex-start; gap: .55rem; padding: .7rem; border: 1px solid #f0e0bd; border-radius: .75rem; background: #fffaf0; }
.seller-location-note.is-saved { border-color: #c6ebdf; background: #f2fffb; }
.seller-location-note > span { display: grid; flex: 0 0 27px; width: 27px; height: 27px; place-items: center; color: #ae7218; border-radius: 8px; background: #ffedc9; }
.seller-location-note.is-saved > span { color: var(--seller-teal); background: #d9f6ee; }
.seller-location-note strong, .seller-location-note small { display: block; }
.seller-location-note strong { color: var(--seller-ink); font-size: .7rem; }
.seller-location-note small { margin-top: .12rem; color: #8795a3; font-size: .63rem; }
.seller-save-btn { justify-self: start; color: #fff; font-size: .72rem; font-weight: 800; border: 0; border-radius: .65rem; background: var(--seller-teal); box-shadow: 0 7px 15px rgba(15,118,110,.16); }
.seller-save-btn:hover { color: #fff; background: #0b625c; }
.seller-map-body { padding: 1.05rem; }
.seller-store-map { height: 490px; overflow: hidden; border: 1px solid #dce5e8; border-radius: .8rem; }
.seller-store-map .leaflet-control-attribution { font-size: 8px; }
.seller-map-help { display: flex; align-items: center; gap: .45rem; margin-top: .6rem; color: #8b98a6; font-size: .65rem; }
.seller-map-help i { color: var(--seller-teal); }
.seller-report-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.seller-report-card { min-width: 0; }
.seller-report-table thead th { padding: .7rem 1rem !important; }
.seller-report-table tbody td { padding: .7rem 1rem !important; }
.seller-report-date { color: #687889; font-size: .67rem; white-space: nowrap; }
.seller-orders-count { display: inline-grid; min-width: 25px; height: 25px; padding: 0 .35rem; place-items: center; color: #5b50b5; font-size: .66rem; font-weight: 850; border-radius: 8px; background: #efedff; }
.seller-report-empty { min-height: 145px; justify-content: center; }
.seller-report-empty > i { margin-bottom: .25rem; color: #a5b1bc; font-size: 1.3rem; }
.seller-product-form-page { padding-bottom: 1rem; }
.seller-product-hero .seller-hero-note { color: #fff; }
.seller-product-hero .seller-hero-note:hover { color: #fff; background: rgba(255,255,255,.18); }
.seller-form-alert { display: flex; align-items: flex-start; gap: .65rem; margin-bottom: 1rem; padding: .8rem .95rem; color: #8e3c35; font-size: .72rem; border-color: #f1cbc7; border-radius: .8rem; background: #fff5f4; }
.seller-form-alert > i { margin-top: .08rem; font-size: .95rem; }
.seller-form-alert strong, .seller-form-alert span { display: block; }
.seller-form-alert span { margin-top: .15rem; }
.seller-product-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(255px, .65fr); align-items: start; gap: 1rem; }
.seller-product-form-card, .seller-product-tips-card { min-width: 0; }
.seller-product-form { display: grid; gap: 1rem; padding: 1.15rem; }
.seller-product-form .seller-field-group { min-width: 0; }
.seller-product-form .form-control { min-height: 42px; }
.seller-product-form textarea.form-control { min-height: 102px; }
.seller-product-field-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; }
.seller-label-optional { margin-left: .25rem; color: #a3adb7; font-size: .6rem; font-weight: 600; }
.seller-availability-card { display: flex; align-items: center; gap: .7rem; padding: .75rem .8rem; border: 1px solid #d9eee8; border-radius: .8rem; background: #f4fffc; }
.seller-availability-icon, .seller-upload-icon { display: grid; flex: 0 0 34px; width: 34px; height: 34px; place-items: center; color: var(--seller-teal); border-radius: 10px; background: #dff8f1; }
.seller-availability-copy { min-width: 0; flex: 1; }
.seller-availability-copy strong, .seller-availability-copy small { display: block; }
.seller-availability-copy strong { color: var(--seller-ink); font-size: .72rem; }
.seller-availability-copy small { margin-top: .15rem; color: #7e918f; font-size: .64rem; line-height: 1.45; }
.seller-availability-card .form-check { margin: 0; padding-left: 2.55em; }
.seller-availability-card .form-check-input { width: 2.1em; height: 1.15em; margin-top: 0; cursor: pointer; }
.seller-availability-card .form-check-input:checked { background-color: var(--seller-teal); border-color: var(--seller-teal); }
.seller-product-upload { padding-top: .05rem; }
.seller-upload-box { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: .7rem; padding: .75rem; border: 1px dashed #bddbd5; border-radius: .8rem; background: #fbfffe; }
.seller-upload-box > div { min-width: 0; }
.seller-upload-box strong, .seller-upload-box small { display: block; }
.seller-upload-box strong { color: var(--seller-ink); font-size: .7rem; }
.seller-upload-box small { margin-top: .15rem; color: #8b9a9d; font-size: .62rem; }
.seller-upload-box input[type="file"] { grid-column: 1 / -1; min-height: 40px; padding: .45rem .6rem; color: #75828e; font-size: .68rem; background: #fff; }
.seller-current-image { display: flex; align-items: center; gap: .55rem; margin-top: .55rem; color: #82909d; font-size: .63rem; }
.seller-current-image img { width: 48px; height: 48px; object-fit: cover; border: 1px solid #dce7e8; border-radius: .65rem; }
.seller-product-form-footer { display: flex; justify-content: flex-end; gap: .55rem; padding-top: .2rem; border-top: 1px solid #eef2f3; }
.seller-product-form-footer .btn { min-height: 38px; padding: .55rem .8rem; font-size: .7rem; font-weight: 800; border-radius: .65rem; }
.seller-cancel-btn { color: #667586; border: 1px solid #dce5e9; background: #fff; }
.seller-cancel-btn:hover { color: #344355; border-color: #c8d4da; background: #f8fafb; }
.seller-product-form-footer .seller-save-btn { padding-right: 1rem; padding-left: 1rem; }
.seller-product-tips { display: grid; gap: .9rem; padding: 1.15rem; }
.seller-product-tip { display: flex; align-items: flex-start; gap: .65rem; }
.seller-product-tip > span { display: grid; flex: 0 0 32px; width: 32px; height: 32px; place-items: center; color: #a66b12; border-radius: 10px; background: #fff3dd; }
.seller-product-tip strong, .seller-product-tip small { display: block; }
.seller-product-tip strong { color: var(--seller-ink); font-size: .7rem; }
.seller-product-tip small { margin-top: .15rem; color: #8a98a5; font-size: .63rem; line-height: 1.45; }

@media (max-width: 991.98px) {
  .seller-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .seller-store-layout { grid-template-columns: 1fr; }
  .seller-store-map { height: 380px; }
  .seller-product-layout { grid-template-columns: 1fr; }
}

@media (max-width: 767.98px) {
  .seller-page-hero { align-items: flex-start; flex-direction: column; padding: 1rem; border-radius: 1rem; }
  .seller-hero-icon { flex-basis: 44px; width: 44px; height: 44px; border-radius: 13px; }
  .seller-hero-action, .seller-hero-note { align-self: flex-start; }
  .seller-content-heading { padding: .9rem; }
  .seller-content-heading p { line-height: 1.4; }
  .seller-content-card .table-responsive { overflow: visible; }
  .seller-content-card table, .seller-content-card thead, .seller-content-card tbody, .seller-content-card tr, .seller-content-card th, .seller-content-card td { display: block; width: 100%; }
  .seller-content-card thead { display: none; }
  .seller-content-card tbody tr { padding: .7rem .9rem; border-bottom: 1px solid var(--seller-line); }
  .seller-content-card tbody tr:last-child { border-bottom: 0; }
  .seller-content-card tbody td { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .38rem 0 !important; border: 0; text-align: right; }
  .seller-content-card tbody td::before { flex: 0 0 auto; color: #99a5b0; font-size: .61rem; font-weight: 850; letter-spacing: .04em; text-align: left; text-transform: uppercase; content: attr(data-label); }
  .seller-content-card tbody td:first-child { align-items: flex-start; }
  .seller-content-card tbody td:first-child::before { padding-top: .25rem; }
  .seller-product-cell, .seller-customer-cell { min-width: 0; text-align: left; }
  .seller-product-copy { text-align: left; }
  .seller-product-copy small { max-width: 190px; }
  .seller-table-actions { display: flex !important; flex-wrap: wrap; justify-content: flex-end; }
  .seller-table-actions::before { margin-right: auto; }
  .seller-table-empty { padding: 1.5rem .5rem; }
  .seller-report-grid { grid-template-columns: 1fr; }
  .seller-report-table tbody td { display: flex; }
  .seller-report-table tbody td[data-label]::before { content: attr(data-label); }
  .seller-product-field-grid { grid-template-columns: 1fr; gap: 1rem; }
  .seller-product-form { padding: .9rem; }
  .seller-product-tips { padding: .9rem; }
}

@media (max-width: 575.98px) {
  .seller-page { padding-top: .75rem !important; }
  .seller-stat-grid { grid-template-columns: 1fr 1fr; gap: .55rem; }
  .seller-stat-card { gap: .5rem; padding: .65rem; }
  .seller-stat-icon { flex-basis: 31px; width: 31px; height: 31px; font-size: .8rem; border-radius: 9px; }
  .seller-stat-card strong { font-size: .9rem; }
  .seller-stat-card > div > span { font-size: .56rem; }
  .seller-stat-card small { font-size: .56rem; }
  .seller-store-form, .seller-map-body { padding: .95rem; }
  .seller-store-map { height: 300px; }
  .seller-save-btn { width: 100%; }
  .seller-count-chip { font-size: .58rem; }
  .seller-product-form-footer { align-items: stretch; flex-direction: column-reverse; }
  .seller-product-form-footer .btn { width: 100%; }
  .seller-availability-card { align-items: flex-start; }
}

/* Admin inner workspace */
body.admin-page { background: #f4f8fa !important; }
.admin-page .admin-content { background: radial-gradient(circle at 95% 0%, rgba(15,118,110,.06), transparent 25rem); }
.admin-page-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  padding: 1.1rem 1.2rem;
  border: 1px solid #e1ebef;
  border-radius: 1rem;
  background: linear-gradient(135deg, #f7fffd, #fff 68%, #fff9ec);
  box-shadow: 0 8px 22px rgba(15,23,42,.045);
}
.admin-page-kicker { display: block; color: #0f766e; font-size: .65rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.admin-page-heading h1 { margin: .15rem 0 .2rem; color: var(--ce-ink); font-size: clamp(1.2rem, 2vw, 1.65rem); font-weight: 850; letter-spacing: -.03em; }
.admin-page-heading p { max-width: 700px; margin: 0; color: var(--ce-muted); font-size: .73rem; }
.admin-heading-badge { display: inline-flex; align-items: center; flex: 0 0 auto; gap: .3rem; padding: .5rem .7rem; color: #0f766e; font-size: .67rem; font-weight: 800; border-radius: 999px; background: #e7f8f4; }
.admin-filter-bar { display: flex; align-items: center; gap: .55rem; padding: .65rem .75rem; border: 1px solid #e2ebef; border-radius: .85rem; background: rgba(255,255,255,.86); box-shadow: 0 6px 18px rgba(15,23,42,.035); }
.admin-filter-bar .form-control, .admin-filter-bar .form-select { min-height: 39px; color: var(--ce-ink); font-size: .75rem; border-color: #dce7eb; border-radius: .62rem; box-shadow: none; }
.admin-filter-bar .form-control:focus, .admin-filter-bar .form-select:focus { border-color: #74c5b8; box-shadow: 0 0 0 .18rem rgba(15,118,110,.1); }
.admin-filter-label { flex: 0 0 auto; color: #697888; font-size: .68rem; font-weight: 800; white-space: nowrap; }
.admin-filter-bar .form-select { max-width: 220px; }
.admin-filter-bar .btn { min-height: 39px; font-size: .7rem; font-weight: 800; border-radius: .62rem; }
.admin-data-card, .admin-report-card, .admin-map-card { border: 1px solid #e1ebef !important; border-radius: 1rem !important; background: #fff; box-shadow: 0 9px 25px rgba(15,23,42,.05); }
.admin-data-card { overflow: hidden; }
.admin-documents-page { max-width: 1220px; padding-bottom: 1rem; }
.admin-documents-hero { align-items: flex-start; }
.admin-documents-hero-copy { min-width: 0; }
.admin-documents-hero-copy > p { max-width: 760px; }
.admin-documents-user { display: inline-flex; align-items: center; gap: .6rem; max-width: 100%; margin-top: .85rem; padding: .45rem .65rem .45rem .45rem; border: 1px solid #e2efed; border-radius: .75rem; background: rgba(255,255,255,.72); }
.admin-documents-avatar { display: grid; width: 32px; height: 32px; flex: 0 0 32px; place-items: center; color: #fff; border-radius: 10px; background: linear-gradient(135deg,#0f766e,#2563eb); }
.admin-documents-user strong, .admin-documents-user small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-documents-user strong { color: var(--ce-ink); font-size: .73rem; }
.admin-documents-user small { margin-top: .12rem; color: #71808d; font-size: .63rem; }
.admin-documents-back { flex: 0 0 auto; min-height: 39px; font-size: .7rem; font-weight: 800; border-radius: .62rem; }
.admin-documents-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .75rem; margin-bottom: 1rem; }
.admin-documents-summary-card { min-width: 0; padding: .85rem .95rem; border: 1px solid #e1ebef; border-radius: .9rem; background: #fff; box-shadow: 0 7px 20px rgba(15,23,42,.04); }
.admin-documents-summary-card > span:first-child { display: flex; align-items: center; gap: .35rem; color: #81909c; font-size: .62rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.admin-documents-summary-card > span:first-child i { color: #0f766e; font-size: .8rem; }
.admin-documents-summary-card strong { display: block; margin-top: .35rem; overflow-wrap: anywhere; color: var(--ce-ink); font-size: .85rem; font-weight: 850; }
.admin-documents-summary-card small { display: block; margin-top: .3rem; overflow-wrap: anywhere; color: #81909c; font-size: .62rem; }
.admin-documents-summary-card .badge { margin-top: .35rem; font-size: .6rem; }
.admin-documents-panel { padding: 1.15rem; }
.admin-documents-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-bottom: .95rem; border-bottom: 1px solid #edf2f4; }
.admin-documents-panel-head h2 { margin: .18rem 0 .18rem; color: var(--ce-ink); font-size: 1.05rem; font-weight: 850; letter-spacing: -.02em; }
.admin-documents-panel-head p { margin: 0; color: #71808d; font-size: .7rem; }
.admin-documents-groups { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .85rem; padding-top: 1rem; }
.admin-document-group { min-width: 0; padding: .85rem; border: 1px solid #e3ecef; border-radius: .85rem; background: #fbfdfd; }
.admin-document-group-head { display: flex; align-items: center; gap: .6rem; margin-bottom: .7rem; }
.admin-document-group-icon { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; color: #0f766e; border-radius: 10px; background: #e5f8f3; }
.admin-document-group-head h3 { margin: 0; color: var(--ce-ink); font-size: .77rem; font-weight: 850; }
.admin-document-group-head span { display: block; margin-top: .12rem; color: #8a98a5; font-size: .62rem; }
.admin-document-list { display: grid; gap: .45rem; }
.admin-document-item { display: grid; grid-template-columns: 32px minmax(0,1fr) auto; align-items: center; gap: .55rem; min-width: 0; padding: .55rem; color: inherit; text-decoration: none; border: 1px solid #e4edef; border-radius: .7rem; background: #fff; transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease; }
.admin-document-item:hover { border-color: #8fd5c8; box-shadow: 0 5px 14px rgba(15,118,110,.1); transform: translateY(-1px); }
.admin-document-icon { display: grid; width: 32px; height: 32px; place-items: center; color: #2563eb; border-radius: 9px; background: #edf4ff; font-size: .9rem; }
.admin-document-copy { min-width: 0; }
.admin-document-copy strong, .admin-document-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-document-copy strong { color: #263746; font-size: .7rem; font-weight: 800; }
.admin-document-copy small { margin-top: .12rem; color: #91a0aa; font-size: .59rem; }
.admin-document-open { display: inline-flex; align-items: center; gap: .3rem; color: #0f766e; font-size: .6rem; font-weight: 850; white-space: nowrap; }
.admin-document-open i { font-size: .75rem; }
.admin-documents-empty { display: flex; align-items: center; flex-direction: column; gap: .25rem; padding: 3rem 1rem 2.5rem; color: #8997a2; text-align: center; }
.admin-documents-empty i { margin-bottom: .25rem; color: #0f766e; font-size: 2.1rem; }
.admin-documents-empty strong { color: #52626f; font-size: .82rem; }
.admin-documents-empty span { font-size: .68rem; }
.admin-data-table { margin: 0; }
.admin-data-table thead th { padding: .75rem .9rem; color: #8a98a5; font-size: .61rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; border-bottom: 1px solid #e6eef1; background: #f9fbfc; }
.admin-data-table tbody td { padding: .75rem .9rem; color: #566577; font-size: .73rem; border-color: #edf2f4; vertical-align: middle; }
.admin-data-table tbody tr:last-child td { border-bottom: 0; }
.admin-data-table tbody tr:hover { background: #fbfefd; }
.admin-data-table tbody td strong { color: var(--ce-ink); }
.admin-table-actions { min-width: 110px; white-space: nowrap; }
.admin-table-actions .btn { margin: .1rem; font-size: .63rem; font-weight: 800; border-radius: .55rem; }
.admin-soft-chip, .admin-action-chip, .admin-number-chip { display: inline-flex; align-items: center; max-width: 210px; padding: .33rem .5rem; overflow: hidden; color: #647487; font-size: .64rem; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; border-radius: 999px; background: #f1f5f7; }
.admin-action-chip { color: #5e50a9; background: #efedff; }
.admin-number-chip { min-width: 27px; justify-content: center; color: #0f766e; background: #e6f8f2; }
.admin-money { color: #0f766e; font-size: .78rem; white-space: nowrap; }
.admin-order-id { color: #5f7184; font-size: .7rem; font-weight: 850; }
.admin-date-cell { color: #83909d; font-size: .64rem; white-space: nowrap; }
.admin-report-card { height: 100%; overflow: hidden; }
.admin-report-card .card-body { padding: 1rem; }
.admin-report-card h6 { margin-bottom: .8rem; color: var(--ce-ink); font-size: .82rem; font-weight: 850; }
.admin-report-card .table { margin-bottom: 0; }
.admin-report-card .table thead th { color: #8b98a5; font-size: .6rem; text-transform: uppercase; letter-spacing: .05em; }
.admin-report-card .table tbody td { color: #607080; font-size: .7rem; }
.admin-map-card { padding: .7rem; }
.admin-live-map { height: 540px; overflow: hidden; border: 1px solid #dce7ea; border-radius: .78rem; }
.admin-live-map .leaflet-control-attribution { font-size: 8px; }
.admin-map-legend .badge { padding: .45rem .6rem; color: #607080 !important; font-size: .64rem; border-radius: 999px; background: #fff !important; }
.admin-live-badge { color: #13795b; background: #e5f8ef; }
.admin-live-badge > span { width: 7px; height: 7px; border-radius: 50%; background: #16a34a; box-shadow: 0 0 0 4px rgba(22,163,74,.12); }
.admin-page .admin-content > .row > [class*="col"] > .card,
.admin-page .admin-content > .row > [class*="col"] > .application-status-card,
.admin-page .admin-content > .row > [class*="col"] > .settings-card { border-radius: 1rem; box-shadow: 0 8px 22px rgba(15,23,42,.045); }
.admin-page .admin-content .form-control, .admin-page .admin-content .form-select { border-color: #dce7eb; border-radius: .65rem; box-shadow: none; }
.admin-page .admin-content .form-control:focus, .admin-page .admin-content .form-select:focus { border-color: #74c5b8; box-shadow: 0 0 0 .18rem rgba(15,118,110,.1); }
.admin-order-review-page { max-width: 1180px; padding-bottom: 1rem; }
.admin-order-review-page .order-view-info strong { white-space: normal; overflow-wrap: anywhere; }
.admin-order-review-page .order-view-info { min-height: 70px; }
.admin-review-live-chip, .order-items-count { display: inline-flex; align-items: center; flex: 0 0 auto; padding: .38rem .55rem; color: #0f766e; font-size: .63rem; font-weight: 800; border-radius: 999px; background: #e7f8f4; }
.admin-order-contact { display: block; margin-top: .3rem; color: #0f766e; font-size: .65rem; text-decoration: none; }
.admin-order-contact:hover { color: #0b625c; }
.admin-order-assignment { padding-bottom: 1rem; }
.admin-order-assignment-form { display: grid; gap: .55rem; padding: 1rem 1.1rem 0; }
.admin-order-assignment-form label { color: #52626f; font-size: .69rem; font-weight: 800; }
.admin-order-assignment-form .form-select { min-height: 40px; font-size: .73rem; }
.admin-order-assignment-form small { color: #8a98a5; font-size: .62rem; line-height: 1.4; }
.admin-order-assignment-form small i { color: #0f766e; }
.admin-order-assignment-form .btn { margin-top: .25rem; min-height: 39px; font-size: .7rem; font-weight: 800; border-radius: .65rem; }
.admin-assignment-alert { margin: 1rem 1.1rem 0; }
.admin-users-card { overflow: visible; }
.admin-users-card .table-responsive { overflow: visible; }
.admin-users-table tbody td:nth-child(3), .admin-users-table tbody td:nth-child(4) { display: none !important; }
.admin-users-table tbody td:nth-child(5)::before, .admin-users-table tbody td:nth-child(6)::before { content: attr(data-label) !important; }
.admin-user-summary { min-width: 0; }
.admin-user-summary strong, .admin-user-summary small, .admin-user-summary .admin-user-role { display: block; }
.admin-user-summary strong { color: var(--ce-ink); font-size: .75rem; }
.admin-user-summary small { margin-top: .15rem; color: #8a98a5; font-size: .64rem; overflow-wrap: anywhere; }
.admin-user-role { margin-top: .28rem; color: #697888; font-size: .6rem; font-weight: 800; text-transform: capitalize; }
.admin-user-role i { color: #0f766e; }
.admin-user-access { display: flex; flex-wrap: wrap; gap: .3rem; }
.admin-access-chip, .admin-no-access { display: inline-flex; align-items: center; padding: .35rem .5rem; font-size: .62rem; font-weight: 800; border-radius: 999px; }
.admin-access-chip.seller { color: #0f766e; background: #e5f8f2; }
.admin-access-chip.rider { color: #315e9b; background: #eaf2ff; }
.admin-no-access { color: #8996a2; background: #f1f4f6; }
.admin-user-actions { min-width: 125px; }
.admin-user-actions > form, .admin-user-actions > a, .admin-user-actions > span { display: none !important; }
.admin-user-actions .dropdown-toggle { min-width: 108px; font-size: .66rem; font-weight: 800; border-radius: .58rem; }
.admin-user-actions .dropdown-menu { min-width: 225px; padding: .4rem; border-color: #e0eaed; }
.admin-user-actions .dropdown-header { padding: .35rem .65rem .25rem; color: #8a98a5; font-size: .59rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.admin-user-actions .dropdown-item, .admin-user-actions .dropdown-item-text { display: flex; align-items: center; width: 100%; min-height: 34px; padding: .45rem .65rem; font-size: .68rem; border-radius: .45rem; }
.admin-user-actions .dropdown-item form { width: 100%; }
.admin-user-actions .dropdown-item:hover { background: #f1faf8; }

@media (max-width: 767.98px) {
  .admin-page-heading { align-items: flex-start; flex-direction: column; padding: .95rem; }
  .admin-heading-badge { align-self: flex-start; }
  .admin-filter-bar { align-items: stretch; flex-wrap: wrap; }
  .admin-filter-label { width: 100%; }
  .admin-filter-bar .form-control, .admin-filter-bar .form-select { max-width: none; flex: 1 1 180px; }
  .admin-data-table thead { display: none; }
  .admin-data-table, .admin-data-table tbody, .admin-data-table tr, .admin-data-table td { display: block; width: 100%; }
  .admin-data-table tbody tr { padding: .65rem .8rem; border-bottom: 1px solid #e7eef1; }
  .admin-data-table tbody tr:last-child { border-bottom: 0; }
  .admin-data-table tbody td { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .38rem 0; border: 0; text-align: right; overflow-wrap: anywhere; }
  .admin-data-table tbody td::before { flex: 0 0 auto; color: #98a5b1; font-size: .6rem; font-weight: 850; letter-spacing: .04em; text-align: left; text-transform: uppercase; content: attr(data-label); }
  .admin-data-table tbody td.admin-table-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; }
  .admin-data-table tbody td.admin-table-actions::before { margin-right: auto; }
  .admin-soft-chip { max-width: 200px; }
  .admin-live-map { height: 420px; }
  .admin-report-card .table-responsive { overflow-x: auto; }
  .admin-order-review-page .order-view-info { min-height: 0; }
  .admin-users-card .table-responsive { overflow: visible; }
  .admin-users-table tbody td.admin-user-actions { display: flex; justify-content: flex-end; }
  .admin-users-table tbody td.admin-user-actions::before { margin-right: auto; }
  .admin-user-actions .dropdown-menu { position: fixed; inset: auto .65rem .65rem auto !important; max-width: calc(100vw - 1.3rem); transform: none !important; }
  .admin-documents-summary { grid-template-columns: 1fr 1fr; }
  .admin-documents-summary-card:last-child { grid-column: 1 / -1; }
  .admin-documents-groups { grid-template-columns: 1fr; }
}

@media (max-width: 575.98px) {
  .admin-page-heading h1 { font-size: 1.2rem; }
  .admin-page-heading p { line-height: 1.45; }
  .admin-map-card { padding: .5rem; }
  .admin-live-map { height: 330px; }
  .admin-data-table tbody tr { padding-right: .65rem; padding-left: .65rem; }
  .admin-table-actions .btn { flex: 1 1 110px; }
  .admin-documents-hero { gap: .8rem; }
  .admin-documents-back { width: 100%; }
  .admin-documents-user { display: flex; width: 100%; }
  .admin-documents-summary { grid-template-columns: 1fr; }
  .admin-documents-summary-card:last-child { grid-column: auto; }
  .admin-documents-panel { padding: .85rem; }
  .admin-documents-panel-head { align-items: stretch; flex-direction: column; gap: .65rem; }
  .admin-documents-panel-head .admin-heading-badge { align-self: flex-start; }
  .admin-document-open span { display: none; }
}

/* Admin user approval containers */
.admin-payment-review-hero { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; padding:1.25rem 1.4rem; color:#fff; border-radius:1.1rem; background:linear-gradient(135deg,#122e42 0%,#0f766e 100%); box-shadow:0 14px 30px rgba(15,23,42,.13); }
.admin-payment-review-hero-copy { min-width: 0; }
.admin-payment-review-kicker { color:#b9fff1; font-size:.65rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }
.admin-payment-review-hero h1 { margin:.2rem 0 .25rem; color:#fff; font-size:clamp(1.45rem,3vw,2rem); font-weight:850; }
.admin-payment-review-hero p { margin:0; color:rgba(255,255,255,.74); font-size:.78rem; }
.admin-payment-review-flow { display:flex; align-items:center; flex-wrap:wrap; gap:.4rem; margin-top:.85rem; }
.admin-payment-review-flow span { display:inline-flex; align-items:center; gap:.35rem; color:rgba(255,255,255,.7); font-size:.62rem; font-weight:750; }
.admin-payment-review-flow span.active { color:#fff; }
.admin-payment-review-flow b { display:grid; width:21px; height:21px; place-items:center; color:#b9fff1; border:1px solid rgba(255,255,255,.25); border-radius:50%; background:rgba(255,255,255,.1); font-size:.6rem; }
.admin-payment-review-flow span.active b { color:#0f766e; border-color:#b9fff1; background:#b9fff1; }
.admin-payment-review-flow > i { color:rgba(255,255,255,.42); font-size:.65rem; }
.admin-payment-review-hero-icon { display:grid; flex:0 0 52px; width:52px; height:52px; place-items:center; color:#cafff4; font-size:1.7rem; border:1px solid rgba(255,255,255,.15); border-radius:16px; background:rgba(255,255,255,.1); }
.admin-payment-review-summary { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.7rem; margin-bottom:1rem; }
.admin-payment-review-stat { position:relative; overflow:hidden; min-height:92px; padding:.8rem .9rem; border:1px solid #e1ebef; border-radius:.9rem; background:#fff; box-shadow:0 7px 20px rgba(15,23,42,.045); }
.admin-payment-review-stat span, .admin-payment-review-stat strong, .admin-payment-review-stat small { display:block; position:relative; z-index:1; }
.admin-payment-review-stat span { color:#7f8d98; font-size:.61rem; font-weight:850; letter-spacing:.06em; text-transform:uppercase; }
.admin-payment-review-stat strong { margin-top:.25rem; color:#263947; font-size:1.45rem; line-height:1; }
.admin-payment-review-stat small { margin-top:.35rem; color:#9aa7b0; font-size:.65rem; }
.admin-payment-review-stat i { position:absolute; right:.75rem; bottom:.55rem; color:#dcefeb; font-size:2rem; }
.admin-payment-review-stat.stat-review strong { color:#a16207; }.admin-payment-review-stat.stat-review i { color:#f5e4bd; }
.admin-payment-review-stat.stat-submitted strong, .admin-payment-review-stat.stat-approved strong { color:#0f766e; }.admin-payment-review-stat.stat-submitted i, .admin-payment-review-stat.stat-approved i { color:#d9f3ec; }
.admin-payment-review-stat.stat-waiting strong { color:#64748b; }.admin-payment-review-stat.stat-waiting i { color:#e6ebf0; }
.admin-user-status-stack { display:flex; flex-direction:column; align-items:flex-start; gap:.25rem; }
.admin-account-review-chip { display:inline-flex; align-items:center; padding:.28rem .5rem; border-radius:999px; font-size:.6rem; font-weight:850; white-space:nowrap; }
.admin-account-review-chip.review { color:#a16207; background:#fff0d1; }
.admin-account-review-chip.restricted { color:#b42318; background:#fee4e2; }
.admin-account-review-note { display:block; max-width:150px; overflow:hidden; color:#9a6b20; font-size:.58rem; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.approval-queue-container, .approval-approved-container {
  overflow: hidden;
  margin-bottom: 1rem;
  border: 1px solid #e1ebef;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 9px 25px rgba(15,23,42,.05);
}
.approval-approved-container { margin-top: 1rem; }
.approval-queue-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; padding: 1rem 1.15rem; border-bottom: 1px solid #e8eef1; background: linear-gradient(135deg, #fffaf0, #fff); }
.approval-approved-container .approval-queue-heading { background: linear-gradient(135deg, #f2fffb, #fff); }
.approval-section-kicker { display: block; color: #aa6d0f; font-size: .64rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.approval-section-kicker-success { color: #0f766e; }
.approval-queue-heading h2 { margin: .15rem 0 .2rem; color: var(--ce-ink); font-size: 1rem; font-weight: 850; }
.approval-queue-heading p { margin: 0; color: var(--ce-muted); font-size: .7rem; }
.approval-queue-count { flex: 0 0 auto; padding: .42rem .62rem; color: #9a6517; font-size: .64rem; font-weight: 850; border-radius: 999px; background: #fff0d1; }
.approval-queue-count-success { color: #0f766e; background: #def7ef; }
.approval-user-list { display: grid; gap: .75rem; padding: .85rem; }
.approval-user-card { overflow: hidden; border: 1px solid #e6edf0; border-radius: .9rem; background: #fff; box-shadow: 0 5px 16px rgba(15,23,42,.035); }
.approval-user-header { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; padding: .9rem; background: #fbfcfd; border-bottom: 1px solid #edf2f4; }
.approval-user-identity { display: flex; align-items: center; gap: .65rem; min-width: 0; }
.approval-user-avatar, .approval-approved-avatar { display: grid; flex: 0 0 39px; width: 39px; height: 39px; place-items: center; color: #5b50b5; font-size: 1rem; border-radius: 12px; background: #efedff; }
.approval-user-identity > div { min-width: 0; }
.approval-user-number { display: block; color: #9ba7b2; font-size: .61rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.approval-user-identity h3 { margin: .13rem 0 .12rem; overflow: hidden; color: var(--ce-ink); font-size: .85rem; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.approval-user-identity p { margin: 0; overflow: hidden; color: #718096; font-size: .67rem; text-overflow: ellipsis; white-space: nowrap; }
.approval-user-status { flex: 0 0 auto; padding-top: .1rem; }
.approval-user-status .badge { font-size: .62rem; }
.approval-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; padding: .8rem .9rem; }
.approval-detail-grid > div { min-width: 0; padding: .55rem .6rem; border: 1px solid #edf1f3; border-radius: .65rem; background: #fbfcfd; }
.approval-detail-grid span, .approval-detail-grid strong { display: block; }
.approval-detail-grid span { margin-bottom: .17rem; color: #99a5b0; font-size: .59rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.approval-detail-grid strong { overflow: hidden; color: #4f6071; font-size: .68rem; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.approval-detail-grid strong a { color: #13795b; text-decoration: none; }
.approval-reference { font-family: var(--bs-font-monospace); }
.approval-payment-focus { display:grid; grid-template-columns:1.25fr repeat(3,minmax(0,1fr)); align-items:center; gap:.65rem; margin:0 .9rem .8rem; padding:.7rem; border:1px solid #d9eee8; border-radius:.75rem; background:linear-gradient(135deg,#f4fffc,#fff); }
.approval-payment-focus-title { display:flex; align-items:center; flex-wrap:wrap; gap:.4rem; color:#0f766e; font-size:.7rem; font-weight:850; }
.approval-payment-focus-title i { display:grid; width:28px; height:28px; place-items:center; border-radius:9px; background:#dff8f1; }
.approval-payment-focus-title .badge { font-size:.55rem; }
.approval-payment-focus-detail { min-width:0; padding-left:.65rem; border-left:1px solid #e3efed; }
.approval-payment-focus-detail span, .approval-payment-focus-detail strong { display:block; }
.approval-payment-focus-detail span { color:#94a3ad; font-size:.58rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase; }
.approval-payment-focus-detail strong { margin-top:.15rem; overflow:hidden; color:#405563; font-size:.68rem; text-overflow:ellipsis; white-space:nowrap; }
.approval-user-footer { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem .9rem; border-top: 1px solid #edf2f4; }
.approval-document-box { display: flex; align-items: center; gap: .55rem; min-width: 0; }
.approval-document-box > i { display: grid; flex: 0 0 31px; width: 31px; height: 31px; place-items: center; color: #2563a8; border-radius: 9px; background: #e5f1ff; }
.approval-document-box > div { min-width: 0; }
.approval-document-box span, .approval-document-box a, .approval-document-box strong { display: block; }
.approval-document-box span { color: #99a5b0; font-size: .59rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.approval-document-box a, .approval-document-box strong { margin-top: .12rem; overflow: hidden; font-size: .68rem; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.approval-document-box a { color: #2563a8; text-decoration: none; }
.approval-actions { display: flex; align-items: center; flex: 0 0 auto; flex-wrap: wrap; justify-content: flex-end; gap: .4rem; }
.approval-actions .btn { font-size: .68rem; font-weight: 800; border-radius: .58rem; }
.approval-waiting { padding: .5rem .6rem; font-size: .62rem; }
.approval-empty-state { display: flex; align-items: center; flex-direction: column; gap: .2rem; padding: 2rem 1rem; text-align: center; }
.approval-empty-state > span { display: grid; width: 50px; height: 50px; margin-bottom: .2rem; place-items: center; color: #0f766e; font-size: 1.3rem; border-radius: 50%; background: #e5f8f1; }
.approval-empty-state strong { color: var(--ce-ink); font-size: .78rem; }
.approval-empty-state small { color: #96a3af; font-size: .66rem; }
.approval-approved-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; padding: .85rem; }
.approval-approved-card { display: flex; align-items: center; gap: .6rem; min-width: 0; padding: .7rem; border: 1px solid #e9f0f1; border-radius: .75rem; background: #fbfefd; }
.approval-approved-avatar { flex-basis: 34px; width: 34px; height: 34px; color: #0f766e; font-size: .88rem; border-radius: 10px; background: #def7ef; }
.approval-approved-card > div { min-width: 0; }
.approval-approved-card strong, .approval-approved-card small, .approval-approved-card > div > span { display: block; }
.approval-approved-card strong { overflow: hidden; color: var(--ce-ink); font-size: .72rem; text-overflow: ellipsis; white-space: nowrap; }
.approval-approved-card small { margin: .1rem 0 .3rem; overflow: hidden; color: #8b98a6; font-size: .62rem; text-overflow: ellipsis; white-space: nowrap; }
.approval-approved-card .badge { font-size: .56rem; }
.approval-approved-card em { margin-left: .25rem; color: #9aa6b1; font-size: .59rem; font-style: normal; }

@media (max-width: 767.98px) {
  .admin-payment-review-hero { align-items:flex-start; padding:1rem; }
  .admin-payment-review-flow { gap:.3rem; }
  .admin-payment-review-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .approval-payment-focus { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .approval-payment-focus-title { grid-column:1/-1; }
  .approval-payment-focus-detail:nth-child(3) { border-left:0; }
  .approval-queue-heading { align-items: flex-start; flex-direction: column; padding: .9rem; }
  .approval-queue-count { align-self: flex-start; }
  .approval-user-list, .approval-approved-grid { padding: .65rem; }
  .approval-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: .65rem; }
  .approval-user-footer { align-items: stretch; flex-direction: column; padding: .7rem; }
  .approval-actions { width: 100%; justify-content: stretch; }
  .approval-actions .btn, .approval-actions .approval-waiting { flex: 1 1 120px; text-align: center; }
  .approval-document-box { width: 100%; }
}

@media (max-width: 575.98px) {
  .admin-payment-review-hero-icon { display:none; }
  .admin-payment-review-flow { align-items:flex-start; flex-direction:column; gap:.35rem; }
  .admin-payment-review-flow > i { display:none; }
  .admin-payment-review-summary { gap:.55rem; }
  .admin-payment-review-stat { min-height:82px; padding:.7rem; }
  .admin-payment-review-stat strong { font-size:1.2rem; }
  .approval-payment-focus { grid-template-columns:1fr; }
  .approval-payment-focus-detail { padding-top:.45rem; padding-left:0; border-top:1px solid #e3efed; border-left:0; }
  .approval-user-header { padding: .75rem; }
  .approval-detail-grid { grid-template-columns: 1fr; }
  .approval-approved-grid { grid-template-columns: 1fr; }
}

/* Rider delivery containers: keep records readable without horizontal table scrolling. */
.rider-record-page { padding-bottom: 2rem; }
.rider-record-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.rider-record-heading h1 { margin: .2rem 0 .25rem; color: var(--ce-ink); font-size: clamp(1.45rem, 3vw, 2rem); font-weight: 850; }
.rider-record-heading p { margin: 0; color: var(--ce-muted); font-size: .86rem; }
.rider-record-kicker { color: var(--ce-primary); font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.rider-record-container { padding: .85rem; border: 1px solid #e5edf1; border-radius: 1.15rem; background: #f8fbfc; }
.rider-record-container-header { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .25rem .2rem .8rem; }
.rider-record-container-header h2 { margin: 0; color: var(--ce-ink); font-size: 1rem; font-weight: 800; }
.rider-record-list { display: grid; gap: .75rem; }
.rider-record-card { padding: 1rem; border: 1px solid #e4edf0; border-radius: 1rem; background: #fff; box-shadow: 0 8px 20px rgba(15, 23, 42, .045); }
.rider-record-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; padding-bottom: .75rem; border-bottom: 1px solid #edf2f4; }
.rider-record-number { color: var(--ce-primary); font-family: 'IBM Plex Mono', monospace; font-size: .68rem; font-weight: 700; letter-spacing: .04em; }
.rider-record-name { margin: .2rem 0 0; color: var(--ce-ink); font-size: 1rem; font-weight: 800; }
.rider-record-phone { display: inline-block; margin-top: .25rem; color: #0f766e; font-size: .76rem; text-decoration: none; }
.rider-record-badges { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .35rem; }
.rider-record-badges .badge { font-size: .65rem; }
.rider-delivery-mini-map-wrap { margin: .8rem 0 .1rem; padding: .55rem; border: 1px solid #e3edf0; border-radius: .85rem; background: #f8fbfc; }
.rider-delivery-mini-map-heading { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin: 0 .15rem .45rem; color: #52626f; font-size: .67rem; font-weight: 800; }
.rider-delivery-mini-map-heading span { color: var(--ce-primary); }
.rider-delivery-mini-map-heading a { color: #0f766e; font-size: .62rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.rider-delivery-mini-map-heading a:hover { color: #075985; text-decoration: underline; }
.rider-delivery-mini-map-heading small { color: #8a99a5; font-size: .62rem; font-weight: 600; }
.rider-delivery-mini-map { position: relative; height: 150px; overflow: hidden; border: 1px solid #dce8eb; border-radius: .7rem; background: #eaf3f5; }
.rider-delivery-mini-map .leaflet-control-layers { display: none; }
.rider-delivery-mini-map.is-unavailable::after { content: 'Route coordinates unavailable'; position: absolute; inset: 0; display: grid; place-items: center; color: #64748b; background: rgba(248,251,252,.72); font-size: .72rem; font-weight: 700; }
.rider-available-items { margin: .75rem 0 0; padding: .7rem .75rem; border: 1px solid #e4edf0; border-radius: .8rem; background: #fbfdfd; }
.rider-available-items-heading { display: flex; align-items: center; justify-content: space-between; gap: .6rem; color: var(--ce-primary); font-size: .7rem; font-weight: 800; }
.rider-available-items-heading small { color: #8a99a5; font-size: .62rem; font-weight: 600; }
.rider-available-items-list { display: grid; gap: .35rem; margin-top: .5rem; }
.rider-available-items-list > div { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; color: #52626f; font-size: .73rem; }
.rider-available-items-list span { min-width: 0; overflow-wrap: anywhere; }
.rider-available-items-list strong { color: #0f766e; font-size: .68rem; white-space: nowrap; }
.rider-available-items-list b { flex: 0 0 auto; color: #253342; font-size: .72rem; }
.rider-available-customer-note { display: flex; align-items: flex-start; gap: .55rem; margin-top: .7rem; padding: .65rem .7rem; color: #664b08; border: 1px solid #f8df86; border-radius: .75rem; background: #fffaf0; }
.rider-available-customer-note > i { flex: 0 0 auto; margin-top: .1rem; color: #a16207; }
.rider-available-customer-note span, .rider-available-customer-note strong { display: block; }
.rider-available-customer-note span { color: #a16207; font-size: .6rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.rider-available-customer-note strong { margin-top: .15rem; color: #713f12; font-size: .73rem; line-height: 1.4; overflow-wrap: anywhere; }
.rider-record-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; padding: .85rem 0; }
.rider-record-field span { display: block; margin-bottom: .2rem; color: #8a99a5; font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.rider-record-field strong { display: block; color: #253342; font-size: .8rem; overflow-wrap: anywhere; }
.rider-record-contacts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; padding: .75rem 0 0; border-top: 1px solid #edf2f4; }
.rider-record-contacts a { display: flex; align-items: center; gap: .55rem; min-width: 0; padding: .55rem .65rem; color: #0f766e; border: 1px solid #dceeea; border-radius: .7rem; background: #f7fdfb; text-decoration: none; }
.rider-record-contacts a > i { flex: 0 0 auto; font-size: 1rem; }
.rider-record-contacts a > span { min-width: 0; }
.rider-record-contacts small, .rider-record-contacts strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rider-record-contacts small { color: #8a99a5; font-size: .59rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.rider-record-contacts strong { margin-top: .1rem; color: #253342; font-size: .7rem; }
.rider-record-contacts b { display: grid; flex: 0 0 26px; width: 26px; height: 26px; margin-left: auto; place-items: center; color: #fff; border-radius: 50%; background: #0f766e; font-size: .62rem; }
.rider-record-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; padding-top: .75rem; border-top: 1px solid #edf2f4; }
.rider-record-actions form { margin: 0; }
.rider-record-actions form select { margin-bottom: .45rem; }
.rider-quick-update-form { display: contents; }
.rider-record-empty { padding: 2.5rem 1rem; text-align: center; color: #8796a2; }
.rider-record-empty i { display: block; margin-bottom: .5rem; color: #0f766e; font-size: 2rem; }
.rider-history-rating { color: #f59e0b; font-size: .9rem; white-space: nowrap; }
.rider-history-comment { display: block; max-width: 230px; margin-top: .2rem; color: #71808d; font-size: .72rem; line-height: 1.4; }
.rider-availability-banner { display: flex; align-items: flex-start; gap: .8rem; margin-bottom: 1rem; padding: .9rem 1rem; border: 1px solid #f1d59a; border-radius: 1rem; background: linear-gradient(135deg, #fffaf0, #fff); }
.rider-availability-icon { display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; color: #a16207; background: #fef3c7; border-radius: .75rem; font-size: 1.05rem; }
.rider-availability-banner > div:last-child { min-width: 0; }
.rider-availability-banner span { display: block; color: #a16207; font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.rider-availability-banner strong { display: block; margin-top: .12rem; color: #713f12; font-size: .88rem; }
.rider-availability-banner p { margin: .25rem 0 0; color: #856b42; font-size: .74rem; line-height: 1.45; }
.rider-available-card { transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.rider-available-card:hover { border-color: #b8ddd9; box-shadow: 0 12px 26px rgba(15, 118, 110, .1); transform: translateY(-1px); }
.rider-available-payout { font-size: .95rem !important; }
.rider-available-meta { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem .85rem; padding: .7rem 0 0; border-top: 1px solid #edf2f4; color: #71808d; font-size: .7rem; }
.rider-available-meta span { display: inline-flex; align-items: center; }
.rider-available-meta i { color: var(--ce-primary); }
.rider-available-note { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }

@media (max-width: 767.98px) {
  .rider-record-page { width: 100%; max-width: 100%; padding-right: .65rem !important; padding-left: .65rem !important; overflow-x: hidden; }
  .rider-record-container { width: 100%; max-width: 100%; padding: .55rem; }
  .rider-record-card { width: 100%; max-width: 100%; padding: .68rem; overflow: hidden; }
  .rider-delivery-mini-map-wrap { margin-top: .55rem; padding: .4rem; }
  .rider-delivery-mini-map { height: 118px; }
  .rider-available-items { margin-top: .55rem; padding: .55rem .6rem; }
  .rider-available-customer-note { margin-top: .55rem; padding: .55rem .6rem; }
  .rider-record-grid { gap: .5rem; padding: .6rem 0; }
  .rider-record-contacts { gap: .4rem; padding-top: .6rem; }
  .rider-record-actions { gap: .4rem; padding-top: .6rem; }
  .rider-record-heading { align-items: stretch; flex-direction: column; }
  .rider-record-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rider-record-actions { justify-content: stretch; }
  .rider-record-actions .btn, .rider-record-actions form { flex: 1 1 130px; }
  .rider-record-actions form .btn { width: 100%; }
  .rider-record-page { padding-bottom: .5rem; }
  .rider-record-heading h1 { font-size: clamp(1.35rem, 7vw, 1.8rem); }
  .rider-record-heading p { max-width: 42ch; font-size: .78rem; line-height: 1.45; }
  .rider-record-container-header { align-items: flex-start; flex-direction: column; }
  .rider-record-card-top { gap: .55rem; }
  .rider-record-name { overflow-wrap: anywhere; }
  .rider-record-badges { justify-content: flex-start; }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .rider-record-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 480px) {
  .rider-record-container { padding: .45rem; }
  .rider-record-card { padding: .6rem; }
  .rider-record-card-top { display: block; }
  .rider-record-badges { justify-content: flex-start; margin-top: .6rem; }
  .rider-record-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .rider-record-contacts { grid-template-columns: 1fr; }
  .rider-record-actions { display: grid; }
  .rider-availability-banner { padding: .8rem; }
  .rider-available-meta { align-items: flex-start; flex-direction: column; gap: .35rem; }
}

/* 2026 experience pass: clearer public landing page and focused customer flow. */
.landing-steps {
  padding: 1.15rem;
  border: 1px solid #e2ecef;
  border-radius: 1.25rem;
  background: linear-gradient(135deg, #f7fffd, #fffdf7);
}
.landing-section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .9rem;
}
.landing-kicker {
  color: #0f766e;
  font-size: .65rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.landing-section-heading h2 { margin: .18rem 0 0; color: var(--ce-ink); font-size: 1.1rem; font-weight: 850; }
.landing-section-note { color: #64748b; font-size: .68rem; white-space: nowrap; }
.landing-step-card {
  position: relative;
  height: 100%;
  padding: 1rem;
  border: 1px solid #e5edf0;
  border-radius: 1rem;
  background: #fff;
}
.landing-step-number { color: #0f766e; font-size: .65rem; font-weight: 850; letter-spacing: .08em; }
.landing-step-icon { display: block; margin: .55rem 0 .45rem; color: #0f766e; font-size: 1.35rem; }
.landing-step-card h3 { margin: 0; color: var(--ce-ink); font-size: .86rem; font-weight: 850; }
.landing-step-card p { margin: .35rem 0 0; color: #64748b; font-size: .72rem; line-height: 1.5; }

.checkout-progress {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: 0 0 1.1rem;
  padding: .7rem .85rem;
  border: 1px solid #e4edf0;
  border-radius: .85rem;
  background: #f8fbfc;
}
.checkout-progress-step { display: inline-flex; align-items: center; gap: .35rem; color: #94a3b8; font-size: .68rem; font-weight: 800; }
.checkout-progress-step i { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 50%; background: #e8eef2; }
.checkout-progress-step.is-complete { color: #0f766e; }
.checkout-progress-step.is-complete i { color: #fff; background: #0f766e; }
.checkout-progress-step.is-current { color: #1e293b; }
.checkout-progress-step.is-current i { color: #fff; background: #2563eb; box-shadow: 0 0 0 4px #dbeafe; }
.checkout-progress-arrow { color: #cbd5e1; font-size: .7rem; }

.order-view-hero-side { display: flex; align-items: flex-end; flex-direction: column; gap: .45rem; }
.order-view-hero-link { color: #d1fae5; font-size: .68rem; font-weight: 800; text-decoration: none; }
.order-view-hero-link:hover { color: #fff; text-decoration: underline; }
.track-map-updated { margin-left: .35rem; color: #94a3b8; font-size: .64rem; }

@media (max-width: 767.98px) {
  .landing-section-heading { align-items: flex-start; flex-direction: column; gap: .35rem; }
  .landing-section-note { white-space: normal; }
  .order-view-hero-side { align-items: flex-start; width: 100%; }
}

@media (max-width: 575.98px) {
  .checkout-progress { justify-content: space-between; gap: .25rem; padding: .65rem; }
  .checkout-progress-step { font-size: .6rem; }
  .checkout-progress-step i { width: 22px; height: 22px; }
  .checkout-progress-arrow { font-size: .6rem; }
  .track-map-updated { display: block; margin: .25rem 0 0 1.15rem; }
}

/* Rider duty-hour editor: make the schedule feel like a clear shift builder. */
.rider-duty-form {
  border-color: #cde7e1 !important;
  background: linear-gradient(135deg, #f3fffc, #fbfefd) !important;
}
.rider-duty-form-approved { border-color: #d8e6eb !important; background: #f8fbfc !important; }
.rider-duty-form-label { color: #164e63; font-size: .82rem; font-weight: 850; }
.rider-duty-form-label i { color: #0f766e; }
.rider-duty-form-help { margin: .25rem 0 .85rem; color: #6b7f88; font-size: .7rem; line-height: 1.45; }
.rider-duty-list { display: grid; gap: .55rem; }
.duty-period-row {
  display: grid !important;
  grid-template-columns: minmax(70px, .55fr) minmax(130px, 1fr) auto minmax(130px, 1fr) auto;
  align-items: center;
  gap: .45rem;
  margin-bottom: 0 !important;
  padding: .45rem;
  border: 1px solid #dcebe8;
  border-radius: .75rem;
  background: #fff;
}
.rider-duty-label {
  justify-content: center;
  min-width: 0;
  padding: .55rem .45rem;
  color: #0f766e;
  border: 0;
  border-radius: .5rem;
  background: #e7f8f3;
  font-size: .66rem;
  font-weight: 850;
}
.rider-duty-time { min-width: 0; min-height: 38px; border-color: #d5e4e8; border-radius: .55rem !important; font-size: .75rem; font-weight: 700; }
.duty-period-row > .rider-duty-time { width: 100%; max-width: 100%; flex: 0 0 auto; }
.rider-duty-time:focus { border-color: #0f766e; box-shadow: 0 0 0 .16rem rgba(15,118,110,.1); }
.rider-duty-remove { display: grid; width: 38px; height: 38px; padding: 0; place-items: center; border-radius: .55rem; }
.rider-duty-remove:hover { color: #fff; background: #dc3545; }
.rider-duty-form .rider-duty-add { margin-top: .7rem; border-radius: .6rem; font-size: .7rem; font-weight: 800; }
.rider-duty-example { margin-top: .55rem; color: #718096; font-size: .66rem; }
.rider-duty-example i { color: #0f766e; }
.rider-duty-form > .col-lg-6 > .form-text:not(.rider-duty-example) { display: none; }

@media (max-width: 767.98px) {
  .duty-period-row { grid-template-columns: minmax(105px, .8fr) minmax(125px, 1fr) minmax(105px, .8fr) minmax(125px, 1fr) 36px; gap: .3rem; padding: .35rem; }
  .rider-duty-label { font-size: .6rem; }
  .rider-duty-time { font-size: .7rem; }
}

@media (max-width: 480px) {
  .duty-period-row { grid-template-columns: 1fr 1fr 38px; gap: .4rem; }
  .rider-duty-label { justify-content: flex-start; padding: .25rem .1rem 0; background: transparent; color: #64748b; font-size: .6rem; }
  .duty-period-row > .rider-duty-label:nth-child(1) { grid-column: 1; grid-row: 1; }
  .duty-period-row > .rider-duty-time:nth-child(2) { grid-column: 1; grid-row: 2; }
  .duty-period-row > .rider-duty-label:nth-child(3) { grid-column: 2; grid-row: 1; }
  .duty-period-row > .rider-duty-time:nth-child(4) { grid-column: 2; grid-row: 2; }
  .duty-period-row > .rider-duty-remove:nth-child(5) { grid-column: 3; grid-row: 1 / span 2; align-self: end; }
  .duty-period-row > .rider-duty-time { min-width: 0; width: 100%; }
}

@media (max-width: 767.98px) {
  .rider-duty-form-approved > .d-flex {
    align-items: stretch !important;
    flex-direction: column;
    gap: .7rem !important;
  }

  .rider-duty-form-approved > .d-flex .btn {
    width: 100%;
  }
}

/* Seller-to-rider handoff: explain the request before the seller sends it. */
.seller-rider-assign-intro {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  margin: .85rem 1.1rem 0;
  padding: .7rem .75rem;
  color: #155e75;
  border: 1px solid #bae6fd;
  border-radius: .75rem;
  background: #f0f9ff;
  font-size: .7rem;
  line-height: 1.4;
}
.seller-rider-assign-intro > i { flex: 0 0 auto; margin-top: .1rem; color: #0284c7; }
.seller-rider-assign-intro strong,
.seller-rider-assign-intro span { display: block; }
.seller-rider-assign-intro strong { color: #075985; font-size: .72rem; }
.seller-rider-assign-intro span { margin-top: .15rem; color: #526f7c; }
.seller-rider-empty {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  margin: .85rem 1.1rem 0;
  padding: .8rem;
  color: #92400e;
  border: 1px solid #fde68a;
  border-radius: .75rem;
  background: #fffbeb;
  font-size: .7rem;
  line-height: 1.4;
}
.seller-rider-empty > i { flex: 0 0 auto; margin-top: .1rem; color: #d97706; }
.seller-rider-empty strong,
.seller-rider-empty span { display: block; }
.seller-rider-empty strong { color: #78350f; font-size: .72rem; }
.seller-rider-empty span { margin-top: .15rem; color: #8a6b3c; }
.seller-rider-pending {
  display: flex;
  align-items: flex-start;
  gap: .55rem;
  margin: .75rem 1.1rem 0;
  padding: .65rem .75rem;
  color: #92400e;
  border: 1px solid #fde68a;
  border-radius: .7rem;
  background: #fffbeb;
  font-size: .68rem;
  line-height: 1.4;
}
.seller-rider-pending > i { flex: 0 0 auto; margin-top: .1rem; color: #d97706; }
.seller-rider-pending strong,
.seller-rider-pending span { display: block; }
.seller-rider-pending strong { color: #78350f; font-size: .7rem; }
.seller-rider-pending span { margin-top: .12rem; color: #8a6b3c; }
.seller-live-assignment-status {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: .3rem .45rem;
  color: #0f766e;
  border: 1px solid #c8ebe3;
  border-radius: 999px;
  background: #f0fdfa;
  font-size: .62rem;
  font-weight: 800;
  white-space: nowrap;
}

@media (max-width: 767.98px) {
  /* Keep the rider's next action above the fixed mobile navigation. */
  .rider-record-page { padding-bottom: calc(5.8rem + env(safe-area-inset-bottom)) !important; }
  .rider-record-actions {
    position: sticky;
    bottom: calc(4.35rem + env(safe-area-inset-bottom));
    z-index: 20;
    margin-right: -.68rem;
    margin-left: -.68rem;
    padding: .65rem;
    border: 1px solid #d8e7eb;
    border-radius: .85rem;
    background: rgba(255,255,255,.97);
    box-shadow: 0 10px 24px rgba(15,23,42,.15);
    backdrop-filter: blur(10px);
  }
  .rider-record-actions .rider-quick-update-form { min-width: 0; }
  .rider-record-actions .btn { min-height: 42px; font-weight: 800; }
  .seller-rider-assign-intro,
  .seller-rider-empty,
  .seller-rider-pending { margin-right: .9rem; margin-left: .9rem; }
}

/* Available request cards must keep the accept button after all request details.
   A sticky action bar covers the package and note fields on small screens. */
@media (max-width: 767.98px) {
  .rider-available-page .rider-record-actions {
    position: static !important;
    bottom: auto !important;
    margin: 0;
    padding: .65rem 0 0;
    border: 0;
    border-top: 1px solid #edf2f4;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }
}