:root {
  --primary: #1677ff;
  --primary-dark: #083b8a;
  --primary-soft: #eaf4ff;
  --success: #18a957;
  --warning: #ff9f1c;
  --danger: #e53935;
  --ink: #102033;
  --muted: #637487;
  --line: #d9e8fb;
  --surface: #ffffff;
  --soft-shadow: 0 14px 36px rgba(18, 69, 137, 0.13);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #f7fbff;
}

a {
  color: var(--primary);
  text-decoration: none;
}

.public-shell {
  background:
    linear-gradient(180deg, #f1f7ff 0%, #ffffff 42%, #f8fbff 100%);
}

.container {
  max-width: 1180px;
}

.app-navbar {
  backdrop-filter: blur(18px);
  background: rgba(255, 255, 255, 0.88);
  border-bottom: 1px solid rgba(217, 232, 251, 0.9);
}

.brand-mark {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--primary-dark);
  font-weight: 900;
  letter-spacing: 0;
}

.brand-mark img {
  width: 38px;
  height: 38px;
}

.navbar .nav-link {
  color: #344b66;
  font-weight: 700;
}

.navbar .nav-link.active,
.navbar .nav-link:hover {
  color: var(--primary);
}

.hero {
  position: relative;
  min-height: calc(100vh - 72px);
  display: grid;
  align-items: center;
  overflow: hidden;
  background:
    linear-gradient(120deg, rgba(8, 59, 138, 0.94), rgba(22, 119, 255, 0.78)),
    url("../img/poonch-bike-hero.svg") center/cover no-repeat;
  color: #fff;
}

.hero-inner {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 28px;
  align-items: center;
  padding: 54px 0 34px;
}

.hero h1 {
  font-size: clamp(38px, 8vw, 78px);
  line-height: 0.95;
  margin: 0 0 18px;
  letter-spacing: 0;
  max-width: 760px;
}

.hero p {
  font-size: clamp(16px, 2.8vw, 21px);
  color: rgba(255, 255, 255, 0.86);
  max-width: 680px;
}

.hero-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 24px 0;
}

.hero-badges span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.13);
  color: #fff;
  border-radius: 8px;
  backdrop-filter: blur(12px);
  font-weight: 800;
}

.booking-card,
.auth-card,
.panel-card,
.feature-card,
.stat-card,
.table-card {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.95);
  border-radius: 8px;
  box-shadow: var(--soft-shadow);
}

.booking-card {
  padding: 18px;
  color: var(--ink);
}

.booking-card h2,
.section-title h2,
.auth-card h1,
.panel-title h1 {
  color: var(--primary-dark);
  letter-spacing: 0;
}

.stacked-form {
  display: grid;
  gap: 12px;
}

.stacked-form label {
  color: #314761;
  font-weight: 800;
  display: grid;
  gap: 7px;
}

.form-control,
.form-select {
  min-height: 48px;
  border-radius: 8px;
  border-color: #cae0f7;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 0.2rem rgba(22, 119, 255, 0.14);
}

.btn {
  border-radius: 8px;
  font-weight: 850;
  letter-spacing: 0;
}

.btn-primary {
  background: var(--primary);
  border-color: var(--primary);
  box-shadow: 0 12px 25px rgba(22, 119, 255, 0.22);
}

.btn-primary:hover {
  background: var(--primary-dark);
  border-color: var(--primary-dark);
}

.btn-outline-primary {
  border-color: var(--primary);
  color: var(--primary);
}

.btn-success {
  background: var(--success);
  border-color: var(--success);
}

.btn-warning {
  background: var(--warning);
  border-color: var(--warning);
}

.btn-danger {
  background: var(--danger);
  border-color: var(--danger);
}

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

.fare-strip div {
  padding: 12px;
  background: var(--primary-soft);
  border-radius: 8px;
}

.fare-strip span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.fare-strip strong {
  color: var(--primary-dark);
  font-size: 18px;
}

.map-box {
  min-height: 260px;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #cfe4fb;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.7) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, 0.7) 1px, transparent 1px),
    linear-gradient(135deg, #dcefff, #c9e1ff 45%, #eaf4ff);
  background-size: 34px 34px, 34px 34px, cover;
  position: relative;
}

.map-box::before,
.map-box::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  transform: translate(-50%, -50%);
}

.map-box::before {
  width: 18px;
  height: 18px;
  left: 32%;
  top: 45%;
  background: var(--success);
  box-shadow: 0 0 0 8px rgba(24, 169, 87, 0.18);
}

.map-box::after {
  width: 18px;
  height: 18px;
  left: 68%;
  top: 62%;
  background: var(--danger);
  box-shadow: 0 0 0 8px rgba(229, 57, 53, 0.16);
}

.route-line {
  position: absolute;
  left: 32%;
  top: 45%;
  width: 38%;
  height: 4px;
  background: var(--primary);
  transform: rotate(18deg);
  transform-origin: left center;
  border-radius: 8px;
}

.rider-dot {
  position: absolute;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--primary-dark);
  color: #fff;
  font-size: 14px;
  box-shadow: 0 10px 24px rgba(8, 59, 138, 0.24);
}

.rider-dot:nth-child(2) { left: 42%; top: 31%; }
.rider-dot:nth-child(3) { left: 58%; top: 42%; }
.rider-dot:nth-child(4) { left: 74%; top: 35%; }

.section-pad {
  padding: 70px 0;
}

.section-title {
  max-width: 760px;
  margin-bottom: 28px;
}

.section-title p {
  color: var(--muted);
  font-size: 18px;
}

.feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.feature-card {
  padding: 20px;
}

.feature-card h3 {
  font-size: 20px;
  color: var(--primary-dark);
}

.feature-card p {
  color: var(--muted);
  margin: 0;
}

.timeline {
  display: grid;
  gap: 12px;
  counter-reset: step;
}

.timeline article {
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 14px;
  align-items: start;
}

.timeline article::before {
  counter-increment: step;
  content: counter(step);
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: var(--primary);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 900;
}

.cta-band {
  background: var(--primary-dark);
  color: #fff;
  padding: 34px;
  border-radius: 8px;
}

.cta-band p {
  color: rgba(255, 255, 255, 0.76);
}

.site-footer {
  background: #071e46;
  color: #fff;
  padding: 48px 0 18px;
}

.site-footer a {
  display: block;
  color: rgba(255, 255, 255, 0.7);
  margin: 8px 0;
}

.site-footer h6 {
  color: #fff;
}

.footer-bottom {
  margin-top: 28px;
  padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.6);
}

.auth-wrap {
  min-height: 72vh;
  display: grid;
  place-items: center;
  padding: 42px 16px;
}

.auth-card {
  width: min(100%, 480px);
  padding: 24px;
}

.panel-shell {
  min-height: 100vh;
  background: #eef6ff;
  padding-bottom: 78px;
}

.panel-topbar {
  min-height: 66px;
  padding: 12px 18px;
  background: linear-gradient(135deg, var(--primary-dark), var(--primary));
  color: #fff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  position: sticky;
  top: 0;
  z-index: 20;
}

.panel-topbar .brand-mark,
.panel-topbar .brand-mark span {
  color: #fff;
}

.panel-user {
  display: flex;
  align-items: center;
  gap: 10px;
}

.panel-main {
  width: min(1180px, 100%);
  margin: 0 auto;
  padding: 22px 16px;
}

.panel-title {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: center;
  margin-bottom: 18px;
}

.stat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 18px;
}

.stat-card {
  padding: 18px;
}

.stat-card span {
  color: var(--muted);
  font-weight: 800;
  font-size: 13px;
}

.stat-card strong {
  display: block;
  margin-top: 6px;
  font-size: 28px;
  color: var(--primary-dark);
}

.tone-green strong { color: var(--success); }
.tone-orange strong { color: var(--warning); }
.tone-red strong { color: var(--danger); }

.panel-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 16px;
  align-items: start;
}

.panel-card,
.table-card {
  padding: 18px;
  margin-bottom: 16px;
}

.table-card {
  overflow-x: auto;
}

.table {
  vertical-align: middle;
}

.badge-soft {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: 8px;
  padding: 4px 10px;
  background: var(--primary-soft);
  color: var(--primary-dark);
  font-weight: 800;
}

.online-toggle {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 6px;
  background: #dcecff;
  border-radius: 8px;
}

.online-toggle button {
  min-height: 48px;
}

.ride-request-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  background: rgba(8, 25, 54, 0.88);
  color: #fff;
  display: none;
  align-items: end;
  padding: 16px;
}

.ride-request-modal.show {
  display: flex;
}

.ride-request-sheet {
  width: min(520px, 100%);
  margin: 0 auto;
  background: #fff;
  color: var(--ink);
  border-radius: 8px;
  padding: 18px;
}

.swipe-control {
  position: relative;
  height: 58px;
  border-radius: 8px;
  background: #dff4e8;
  overflow: hidden;
  user-select: none;
  touch-action: none;
}

.swipe-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  background: rgba(24, 169, 87, 0.2);
}

.swipe-thumb {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: var(--success);
  color: #fff;
  font-weight: 900;
  box-shadow: 0 8px 20px rgba(24, 169, 87, 0.26);
}

.swipe-label {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-weight: 900;
  color: #12653b;
  pointer-events: none;
}

.sos-button {
  min-height: 54px;
  background: var(--danger);
  border-color: var(--danger);
}

.bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 30;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  background: rgba(255, 255, 255, 0.95);
  border-top: 1px solid var(--line);
  backdrop-filter: blur(18px);
}

.bottom-nav a {
  min-height: 64px;
  display: grid;
  place-items: center;
  color: #46617d;
  font-weight: 850;
  font-size: 13px;
}

.bottom-nav a:hover {
  color: var(--primary);
}

.mini-list {
  display: grid;
  gap: 10px;
}

.mini-list article {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 12px;
  background: #f8fbff;
  border: 1px solid #e2efff;
  border-radius: 8px;
}

.doc-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}

.doc-list span {
  padding: 10px;
  background: var(--primary-soft);
  color: var(--primary-dark);
  border-radius: 8px;
  font-weight: 800;
}

@media (max-width: 991px) {
  .hero {
    min-height: auto;
  }

  .hero-inner,
  .panel-grid {
    grid-template-columns: 1fr;
  }

  .feature-grid,
  .stat-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .hero-inner {
    padding: 34px 0 24px;
  }

  .booking-card,
  .auth-card,
  .panel-card,
  .table-card,
  .feature-card,
  .stat-card {
    box-shadow: 0 8px 22px rgba(18, 69, 137, 0.11);
  }

  .fare-strip,
  .feature-grid,
  .stat-grid,
  .doc-list {
    grid-template-columns: 1fr;
  }

  .panel-title {
    display: block;
  }

  .panel-topbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .panel-user {
    width: 100%;
    justify-content: space-between;
  }

  .section-pad {
    padding: 46px 0;
  }
}

/* Premium ChaloPoonch UI refresh */
:root {
  --primary: #0b3d2e;
  --primary-dark: #082b21;
  --primary-soft: #e9f1ec;
  --secondary: #145a43;
  --success: #1e8e5a;
  --warning: #e8a317;
  --danger: #d64545;
  --ink: #15231d;
  --muted: #69756f;
  --line: #e4e9e6;
  --surface: #ffffff;
  --bg: #f7f9f8;
  --soft-shadow: 0 1px 2px rgba(11, 61, 46, 0.06), 0 1px 1px rgba(11, 61, 46, 0.04);
  --lift-shadow: 0 18px 46px rgba(11, 61, 46, 0.11);
}

body {
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: var(--bg);
  color: var(--ink);
  font-size: 15px;
}

h1,
h2,
h3,
h4,
.brand-mark,
.panel-title h1,
.section-title h2,
.auth-card h1 {
  font-family: Manrope, Inter, sans-serif;
  letter-spacing: -0.01em;
}

.public-shell {
  background:
    radial-gradient(circle at 14% 10%, rgba(233, 241, 236, 0.9), transparent 28%),
    linear-gradient(180deg, #f7f9f8 0%, #ffffff 46%, #f7f9f8 100%);
}

.app-navbar {
  background: rgba(247, 249, 248, 0.93);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px) saturate(140%);
}

.brand-mark {
  color: var(--primary);
  font-weight: 800;
  font-size: 18px;
}

.brand-mark img {
  width: 34px;
  height: 34px;
  border-radius: 10px;
}

.navbar .nav-link {
  color: rgba(21, 35, 29, 0.72);
  font-size: 14px;
  font-weight: 700;
}

.navbar .nav-link.active,
.navbar .nav-link:hover {
  color: var(--primary);
}

.btn {
  border-radius: 12px;
  font-weight: 800;
  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.15s ease;
}

.btn:active {
  transform: scale(0.97);
}

.btn-primary {
  background: var(--primary);
  border-color: var(--primary);
  box-shadow: 0 10px 24px rgba(11, 61, 46, 0.18);
}

.btn-primary:hover {
  background: var(--secondary);
  border-color: var(--secondary);
}

.btn-outline-primary {
  color: var(--primary);
  border-color: var(--primary);
}

.btn-outline-primary:hover {
  color: var(--primary);
  background: var(--primary-soft);
  border-color: var(--primary);
}

.hero {
  min-height: auto;
  padding: 64px 0 40px;
  background:
    linear-gradient(115deg, rgba(247, 249, 248, 0.98) 0%, rgba(233, 241, 236, 0.88) 48%, rgba(255, 255, 255, 0.96) 100%),
    url("../img/poonch-bike-hero.svg") center/cover no-repeat;
  color: var(--ink);
}

.hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 120px;
  background: linear-gradient(180deg, transparent, var(--bg));
  pointer-events: none;
}

.hero-inner {
  grid-template-columns: 1.05fr 0.95fr;
  gap: 48px;
  padding: 0;
  position: relative;
  z-index: 1;
}

.hero h1 {
  color: var(--ink);
  font-size: clamp(34px, 6vw, 64px);
  line-height: 1.05;
  max-width: 740px;
}

.hero p {
  color: var(--muted);
  font-size: 17px;
  max-width: 560px;
}

.hero-badges {
  margin: 0 0 18px;
}

.hero-badges span {
  min-height: 32px;
  border-radius: 999px;
  border: 1px solid rgba(11, 61, 46, 0.1);
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 12px;
}

.hero-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 28px;
  max-width: 580px;
}

.hero-metrics article {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.72);
  box-shadow: var(--soft-shadow);
}

.hero-metrics strong {
  display: block;
  color: var(--primary);
  font-family: "JetBrains Mono", monospace;
  font-size: 20px;
}

.hero-metrics span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.booking-card,
.auth-card,
.panel-card,
.feature-card,
.stat-card,
.table-card {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.96);
  border-radius: 16px;
  box-shadow: var(--soft-shadow);
}

.booking-card {
  padding: 24px;
  box-shadow: var(--lift-shadow);
}

.booking-card h2,
.section-title h2,
.auth-card h1,
.panel-title h1 {
  color: var(--ink);
}

.form-control,
.form-select {
  border-color: var(--line);
  border-radius: 12px;
  background: #fff;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--secondary);
  box-shadow: 0 0 0 0.18rem rgba(20, 90, 67, 0.12);
}

.fare-strip div {
  background: var(--primary-soft);
  border-radius: 14px;
  border: 1px solid rgba(11, 61, 46, 0.06);
}

.fare-strip strong {
  color: var(--primary);
  font-family: "JetBrains Mono", monospace;
}

.section-pad {
  padding: 64px 0;
}

.section-title p {
  color: var(--muted);
}

.feature-grid {
  gap: 18px;
}

.feature-card {
  padding: 24px;
  border-radius: 18px;
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.feature-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--lift-shadow);
}

.feature-card h3 {
  color: var(--ink);
}

.timeline article::before {
  background: var(--primary);
  border-radius: 11px;
  font-family: "JetBrains Mono", monospace;
}

.mini-list article {
  border-color: var(--line);
  background: #fff;
  border-radius: 14px;
}

.mini-list strong {
  color: var(--primary);
}

.product-suite {
  background: linear-gradient(180deg, #ffffff, var(--primary-soft));
}

.suite-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.suite-grid article,
.app-panel-preview article,
.route-card-grid article {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--soft-shadow);
}

.suite-grid article span {
  display: inline-flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  background: var(--primary-soft);
  color: var(--primary);
  font-family: "JetBrains Mono", monospace;
  font-weight: 800;
  margin-bottom: 14px;
}

.suite-grid h3 {
  color: var(--ink);
  font-size: 18px;
  margin-bottom: 8px;
}

.suite-grid p,
.app-panel-preview span {
  color: var(--muted);
  font-size: 13.5px;
}

.app-panel-preview {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.app-panel-preview strong {
  display: block;
  color: var(--primary);
  margin-bottom: 8px;
  font-family: Manrope, Inter, sans-serif;
}

.route-card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}

.route-card-grid article {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.route-card-grid strong {
  color: var(--primary);
  font-family: "JetBrains Mono", monospace;
  font-size: 20px;
}

.cta-band {
  border-radius: 22px;
  background:
    radial-gradient(circle at 10% 20%, rgba(255, 255, 255, 0.13), transparent 28%),
    linear-gradient(135deg, var(--primary), var(--secondary));
  box-shadow: var(--lift-shadow);
}

.site-footer {
  background: var(--primary);
}

.site-footer .brand-mark,
.site-footer .brand-mark span {
  color: #fff;
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}

.panel-shell {
  background: var(--bg);
}

.panel-topbar {
  background: linear-gradient(135deg, var(--primary), var(--secondary));
  box-shadow: 0 12px 30px rgba(11, 61, 46, 0.14);
}

.stat-card {
  border-radius: 16px;
}

.stat-card strong {
  color: var(--primary);
  font-family: "JetBrains Mono", monospace;
}

.badge-soft {
  background: var(--primary-soft);
  color: var(--primary);
  border-radius: 999px;
}

.live-map-card {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #fff;
  overflow: hidden;
  box-shadow: var(--lift-shadow);
}

.map-toolbar {
  min-height: 54px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.94);
  position: relative;
  z-index: 2;
}

.map-toolbar span,
.map-toolbar strong {
  font-weight: 800;
  color: var(--primary);
  font-size: 13px;
}

.live-map {
  min-height: 390px;
  width: 100%;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.68) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, 0.68) 1px, transparent 1px),
    linear-gradient(135deg, #e9f1ec, #ffffff);
  background-size: 34px 34px, 34px 34px, cover;
  position: relative;
}

.panel-card .live-map,
.table-card .live-map {
  min-height: 320px;
}

.leaflet-container {
  font-family: Inter, sans-serif;
}

.map-marker {
  border: 0;
  background: transparent;
}

.map-marker span {
  width: 38px;
  height: 38px;
  border-radius: 13px;
  display: grid;
  place-items: center;
  color: #fff;
  background: var(--primary);
  border: 3px solid #fff;
  box-shadow: 0 10px 24px rgba(11, 61, 46, 0.24);
  font-size: 11px;
  font-weight: 900;
  animation: markerPulse 1.8s ease-in-out infinite;
}

.marker-drop span {
  background: var(--danger);
}

.marker-pickup span {
  background: var(--success);
}

.marker-busy span {
  background: var(--warning);
}

.marker-offline span {
  background: #7a8580;
}

.marker-sos span {
  background: var(--danger);
}

@keyframes markerPulse {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

.map-chip {
  position: absolute;
  left: 16px;
  bottom: 16px;
  z-index: 3;
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  border-radius: 999px;
  padding: 6px 12px;
  background: #fff;
  color: var(--primary);
  border: 1px solid var(--line);
  font-size: 12px;
  font-weight: 800;
  box-shadow: var(--soft-shadow);
}

.map-chip + .map-chip {
  left: 150px;
}

.chip-green {
  color: var(--success);
}

.map-fallback {
  min-height: 300px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 28px;
  color: var(--muted);
}

.map-fallback strong {
  display: block;
  color: var(--primary);
  font-size: 18px;
}

.auth-card {
  box-shadow: var(--lift-shadow);
}

.auth-card p {
  color: var(--muted);
}

@media (max-width: 991px) {
  .suite-grid,
  .app-panel-preview {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .hero {
    padding: 38px 0 24px;
  }

  .hero-metrics,
  .suite-grid,
  .app-panel-preview,
  .route-card-grid {
    grid-template-columns: 1fr;
  }

  .live-map {
    min-height: 320px;
  }

  .map-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .map-chip,
  .map-chip + .map-chip {
    left: 12px;
    bottom: 12px;
  }

  .map-chip + .map-chip {
    bottom: 48px;
  }
}

/* ChaloPoonch reference UI — final presentation layer */
:root {
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --shadow-sm: 0 1px 2px rgba(11, 61, 46, .06), 0 1px 1px rgba(11, 61, 46, .04);
  --shadow-md: 0 12px 32px rgba(11, 61, 46, .10);
}

body { line-height: 1.5; -webkit-font-smoothing: antialiased; }
:focus-visible { outline: 2px solid var(--secondary); outline-offset: 3px; }
.container { max-width: 1200px; padding-left: 20px; padding-right: 20px; }

.app-navbar { min-height: 65px; padding: 0; box-shadow: none; }
.app-navbar > .container { min-height: 64px; }
.brand-mark { gap: 8px; font-size: 19px; }
.brand-mark img { width: 32px; height: 32px; border-radius: 9px; }
.navbar .nav-link { padding: 21px 12px; font-size: 13.5px; }
.navbar .nav-link.active { position: relative; }
.navbar .nav-link.active::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 0; height: 2px; border-radius: 2px 2px 0 0; background: var(--primary); }
.btn { min-height: 42px; padding: 10px 18px; border-radius: 12px; font-size: 14px; box-shadow: none; }
.btn-sm { min-height: 36px; padding: 7px 14px; border-radius: 10px; font-size: 13px; }
.btn-lg { min-height: 50px; padding: 13px 22px; border-radius: 14px; font-size: 15px; }
.btn-ghost { color: var(--ink); border: 1px solid var(--line); background: transparent; }
.btn-ghost:hover { color: var(--primary); border-color: var(--primary); background: #fff; }

.hero { padding: 64px 0 44px; background: var(--bg); overflow: visible; }
.hero::after { display: none; }
.hero-inner { grid-template-columns: minmax(0, 1.02fr) minmax(420px, .98fr); gap: 64px; align-items: center; }
.hero h1 { max-width: 650px; margin-bottom: 16px; color: var(--ink); font-size: clamp(42px, 5.3vw, 68px); line-height: 1.03; letter-spacing: -.045em; }
.hero p { max-width: 590px; color: var(--muted); font-size: 17px; line-height: 1.65; }
.hero-badges { margin-bottom: 20px; }
.hero-badges span { min-height: 30px; padding: 6px 12px; border: 0; font-size: 12.5px; letter-spacing: .01em; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 28px; color: var(--muted); font-size: 12.5px; font-weight: 700; }
.hero-trust span { display: inline-flex; align-items: center; gap: 7px; }
.hero-trust i { color: var(--success); font-size: 15px; }

.booking-card { padding: 26px; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.booking-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 4px; }
.booking-card-head h2 { margin: 3px 0 0; font-size: 22px; font-weight: 800; }
.booking-kicker { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.availability { display: inline-flex; align-items: center; gap: 6px; margin-top: 2px; padding: 5px 9px; border-radius: 999px; background: #e4f5ec; color: var(--success); font-size: 10.5px; font-weight: 800; white-space: nowrap; }
.availability > span { width: 6px; height: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(30, 142, 90, .12); }
.route-fields { position: relative; padding-left: 24px; margin-top: 8px; }
.route-fields::before { content: ""; position: absolute; left: 5px; top: 28px; bottom: 29px; border-left: 2px dashed var(--line); }
.route-field { position: relative; display: block; }
.route-field::before { content: ""; position: absolute; left: -24px; top: 31px; z-index: 1; width: 11px; height: 11px; border: 2.5px solid var(--primary); border-radius: 50%; background: #fff; }
.route-field.drop-field::before { border-radius: 3px; background: var(--primary); }
.route-field > span, .distance-field { color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .045em; text-transform: uppercase; }
.route-field .form-control { min-height: 46px; margin-top: 4px; padding-left: 13px; color: var(--ink); font-weight: 650; }
.route-connector { height: 8px; }
.distance-field { display: grid; gap: 5px; margin-top: 2px; }
.distance-field .form-control { color: var(--ink); font-size: 14px; font-weight: 700; }
.current-location-btn { justify-self: start; min-height: 36px; padding: 7px 0; border: 0; background: transparent; color: var(--primary); font-size: 12.5px; }
.current-location-btn:hover { background: transparent; color: var(--secondary); }
.fare-strip { gap: 8px; margin: 2px 0 4px; }
.fare-strip div { padding: 10px 11px; border: 0; border-radius: 12px; }
.fare-strip span { font-size: 10px; letter-spacing: .035em; }
.fare-strip strong { margin-top: 2px; font-size: 15px; }
.booking-card > .btn-primary { width: 100%; }

.service-shortcuts { padding: 14px 0 32px; }
.service-shortcut-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.service-shortcut { display: grid; grid-template-columns: 52px 1fr auto; align-items: center; gap: 14px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 18px; background: #fff; color: var(--ink); box-shadow: var(--shadow-sm); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.service-shortcut:hover { color: var(--ink); border-color: rgba(11, 61, 46, .24); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.service-shortcut-icon { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 14px; background: var(--primary-soft); color: var(--primary); font-size: 21px; }
.service-shortcut strong, .service-shortcut small { display: block; }
.service-shortcut strong { margin-bottom: 3px; font-family: Manrope, sans-serif; font-size: 16px; }
.service-shortcut small { color: var(--muted); font-size: 12.5px; }
.service-shortcut > .bi-arrow-right { color: var(--primary); }

.section-pad { padding: 58px 0; }
.bg-white { background: #fff !important; }
.section-title { max-width: 660px; margin-bottom: 30px; }
.section-title h1, .section-title h2 { margin: 0; font-size: clamp(28px, 3vw, 36px); font-weight: 800; letter-spacing: -.025em; }
.section-title p { margin-top: 9px; font-size: 15px; line-height: 1.65; }
.section-eyebrow { display: inline-flex; margin-bottom: 10px; padding: 5px 10px; border-radius: 999px; background: var(--primary-soft); color: var(--primary); font-size: 11px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.map-stage-section { padding-top: 54px; }
.live-map-card { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.map-toolbar { min-height: 52px; }
.mini-list { gap: 0; border-top: 1px solid var(--line); }
.mini-list article { padding: 14px 2px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; }
.timeline { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.timeline article { display: block; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius-md); background: #fff; box-shadow: var(--shadow-sm); }
.timeline article::before { margin-bottom: 16px; width: 34px; height: 34px; font-size: 12px; }
.timeline h3 { font-size: 16px; }
.timeline p { margin: 6px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.feature-card, .suite-grid article, .app-panel-preview article, .route-card-grid article { border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.feature-card { position: relative; padding: 23px; overflow: hidden; }
.feature-card::before { content: ""; position: absolute; top: 0; left: 0; width: 3px; height: 100%; background: var(--primary); opacity: 0; transition: opacity .18s ease; }
.feature-card:hover::before { opacity: 1; }
.cta-band { border-radius: var(--radius-lg); }
.site-footer { margin-top: 10px; padding-top: 52px; }
.site-footer h6 { margin-bottom: 14px; font-size: 11px; letter-spacing: .07em; text-transform: uppercase; opacity: .72; }
.site-footer a { margin: 10px 0; color: rgba(255,255,255,.76); font-size: 13px; }
.site-footer a:hover { color: #fff; }

.panel-topbar { min-height: 64px; padding: 10px 20px; background: var(--primary); box-shadow: none; }
.panel-main { padding-top: 26px; }
.panel-card, .table-card, .stat-card, .auth-card { border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.stat-card { padding: 20px; }
.stat-card span { color: var(--muted); font-size: 11px; letter-spacing: .045em; text-transform: uppercase; }
.bottom-nav { border-top-color: var(--line); box-shadow: 0 -6px 20px rgba(11,61,46,.06); }

@media (max-width: 991px) {
  .app-navbar { padding: 10px 0; }
  .navbar .nav-link { padding: 10px 4px; }
  .navbar .nav-link.active::after { display: none; }
  .hero-inner { grid-template-columns: 1fr; gap: 34px; }
  .hero-copy { max-width: 720px; }
  .booking-card { max-width: 680px; }
  .timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .container { padding-left: 16px; padding-right: 16px; }
  .hero { padding: 40px 0 28px; }
  .hero h1 { font-size: 38px; line-height: 1.06; }
  .hero p { font-size: 15.5px; }
  .hero-trust { gap: 9px 15px; }
  .booking-card { padding: 19px; border-radius: 20px; }
  .booking-card-head { display: block; }
  .availability { margin-top: 9px; }
  .service-shortcut-grid, .timeline { grid-template-columns: 1fr; }
  .service-shortcut { padding: 16px; }
  .section-pad { padding: 46px 0; }
  .fare-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fare-strip div { padding: 9px 7px; }
  .fare-strip strong { font-size: 13px; }
}
.route-status {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 20px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
}
.route-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--line); flex: 0 0 auto; }
.route-status[data-tone="loading"]::before { border: 2px solid var(--line); border-top-color: var(--primary); background: transparent; animation: routeSpin .8s linear infinite; }
.route-status[data-tone="success"] { color: var(--success); }
.route-status[data-tone="success"]::before { background: var(--success); }
.route-status[data-tone="error"] { color: var(--danger); }
.route-status[data-tone="error"]::before { background: var(--danger); }
@keyframes routeSpin { to { transform: rotate(360deg); } }
.route-picker { display: grid; gap: 9px; }
.route-picker-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.route-mode-btn { min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 11px; background: #fff; color: var(--muted); font: 750 12px/1.2 Inter, sans-serif; transition: .15s ease; }
.route-mode-btn:hover { border-color: var(--primary); color: var(--primary); }
.route-mode-btn.active { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.route-picker-map { width: 100%; height: 245px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: #e9f1ec; cursor: crosshair; }
.route-picker-map .leaflet-control-attribution { font-size: 9px; }
.route-picker-help { display: flex; gap: 7px; align-items: flex-start; color: var(--muted); font-size: 11.5px; line-height: 1.45; }
.route-picker-help i { margin-top: 1px; color: var(--primary); }
@media (max-width: 640px) { .route-picker-map { height: 220px; } }
/* Map containment and rider alert stacking fixes */
.app-navbar, .panel-topbar { z-index: 1200 !important; }
.bottom-nav { z-index: 1200 !important; }
.live-map-card, .route-picker-map { isolation: isolate; contain: layout paint; }
.leaflet-container { position: relative; z-index: 0 !important; }
.leaflet-pane { z-index: 1; }
.leaflet-top, .leaflet-bottom { z-index: 20; }
.route-picker { position: relative; z-index: 0; min-width: 0; overflow: visible; }
.route-picker-map { position: relative; max-width: 100%; }
.ride-request-modal { z-index: 10000 !important; isolation: isolate; overscroll-behavior: contain; }
.ride-request-sheet { position: relative; z-index: 1; max-height: calc(100dvh - 32px); overflow-y: auto; border-radius: 20px; box-shadow: 0 -20px 60px rgba(0,0,0,.28); }
body.ride-alert-open { overflow: hidden; }
.rider-alert-status { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; background: var(--primary-soft); color: var(--primary); font-size: 11px; font-weight: 800; }
.rider-alert-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.rider-alert-status[data-state="error"] { background: #fbe7e7; color: var(--danger); }
.rider-alert-status[data-state="connected"] { background: #e4f5ec; color: var(--success); }
/* Accepted ride and OTP state UI */
.ride-state-hero { padding: 4px 0 14px; }
.ride-state-hero h2 { margin: 10px 0 6px; font-size: clamp(25px, 5vw, 38px); color: var(--primary); }
.ride-state-hero p { margin: 0; color: var(--muted); }
.rider-arrival-card { display: grid; grid-template-columns: 54px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 14px; margin: 4px 0 14px; border: 1px solid rgba(11,61,46,.14); border-radius: 18px; background: linear-gradient(135deg, #f2fbf6, #fff); }
.rider-avatar { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; background: var(--primary); color: #fff; font-size: 22px; font-weight: 800; }
.rider-arrival-main { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.rider-arrival-main strong { font-size: 17px; color: var(--text); }
.rider-arrival-main span { color: #9a6900; font-weight: 700; font-size: 13px; }
.rider-arrival-main small { color: var(--muted); overflow-wrap: anywhere; }
.ride-otp-card { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 14px; padding: 14px 16px; border-radius: 16px; background: #102f27; color: #fff; }
.ride-otp-card div { display: flex; flex-direction: column; }
.ride-otp-card span { font-weight: 800; }
.ride-otp-card small { color: rgba(255,255,255,.68); }
.ride-otp-card > strong { font-family: "JetBrains Mono", monospace; font-size: clamp(25px, 7vw, 38px); letter-spacing: .16em; color: #b9f6d2; }
@media (max-width: 620px) {
  .rider-arrival-card { grid-template-columns: 48px minmax(0, 1fr); }
  .rider-arrival-card .btn { grid-column: 1 / -1; width: 100%; }
  .rider-avatar { width: 48px; height: 48px; }
}
/* Native Android User App presentation */
.native-user-app {
  overscroll-behavior-y: contain;
  -webkit-tap-highlight-color: transparent;
}
.native-user-app .app-navbar,
.native-user-app .site-footer { display: none !important; }
.native-user-app .auth-wrap {
  min-height: 100vh;
  padding: 24px 16px;
  background: radial-gradient(circle at 20% 0%, rgba(20, 90, 67, .14), transparent 34%), linear-gradient(180deg, #f4f8f6, #fff 64%);
}
.native-user-app .auth-card {
  border: 1px solid #dde8e2;
  border-radius: 24px;
  box-shadow: 0 24px 70px rgba(11, 61, 46, .14);
}
.native-user-app .panel-topbar {
  min-height: 58px;
  padding: 8px 14px;
  flex-direction: row;
  align-items: center;
  border-radius: 0 0 18px 18px;
}
.native-user-app .panel-topbar .brand-mark img { width: 38px; height: 38px; border-radius: 12px; }
.native-user-app .panel-topbar .brand-mark span { font-size: 16px; }
.native-user-app .panel-user > span { display: none; }
.native-user-app .panel-user { width: auto; }
.native-user-app .panel-user .btn { min-height: 38px; padding: 7px 12px; border-radius: 12px; }
.native-user-app .panel-main { padding: 15px 12px calc(88px + env(safe-area-inset-bottom)); }
.native-user-app .panel-title { margin-bottom: 13px; }
.native-user-app .panel-title h1 { font-size: 26px; }
.native-user-app .panel-card,
.native-user-app .table-card { padding: 15px; border-radius: 18px; }
.native-user-app .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.native-user-app .stat-card { min-width: 0; padding: 13px; border-radius: 16px; }
.native-user-app .stat-card strong { font-size: 21px; overflow-wrap: anywhere; }
.bottom-nav a { grid-template-rows: 24px 18px; align-content: center; gap: 2px; text-decoration: none; }
.bottom-nav a i { font-size: 20px; line-height: 1; }
.bottom-nav a.active { color: var(--primary); }
.bottom-nav a.active i {
  width: 40px;
  height: 27px;
  display: grid;
  place-items: center;
  margin: 0 auto;
  border-radius: 14px;
  background: var(--primary-soft);
}
.native-user-app .bottom-nav { min-height: calc(68px + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom); }
.native-user-app .bottom-nav a { min-height: 68px; font-size: 11px; }
@media (max-width: 380px) {
  .native-user-app .stat-grid { grid-template-columns: 1fr; }
  .native-user-app .bottom-nav a { font-size: 10px; }
}
/* Branded mobile authentication */
.auth-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0 0 22px;
  color: var(--primary);
  font-size: 21px;
  font-weight: 800;
}
.auth-logo img { width: 48px; height: 48px; border-radius: 15px; object-fit: contain; }
.auth-links { display: flex; justify-content: space-between; gap: 14px; margin-top: 18px; font-size: 14px; font-weight: 700; }
.auth-links a { color: var(--primary); text-decoration: none; }
.auth-links a:focus-visible,
.auth-links a:hover { text-decoration: underline; }
.native-user-app .auth-card { width: min(100%, 430px); padding: 26px 20px; }
.native-user-app .auth-card h1 { margin-bottom: 6px; font-size: 29px; }
.native-user-app .auth-card .form-control { min-height: 52px; border-radius: 14px; }
.native-user-app .auth-card .btn { min-height: 52px; border-radius: 14px; }
/* Grocery marketplace */
.grocery-landing{min-height:70vh;background:linear-gradient(180deg,#f3f8f5,#fff)}
.grocery-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.7fr);gap:28px;align-items:center;padding:38px;border:1px solid #dfe9e4;border-radius:28px;background:radial-gradient(circle at 90% 0,rgba(23,139,91,.18),transparent 40%),#fff;box-shadow:0 22px 70px rgba(11,61,46,.1)}
.grocery-hero h1{max-width:760px;margin:10px 0 14px;font-size:clamp(34px,6vw,68px);line-height:1.03;color:var(--primary)}
.grocery-hero p{max-width:680px;color:var(--muted);font-size:18px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;color:var(--success);font-weight:800;font-size:12px}
.service-status-card,.service-unavailable{display:grid;place-items:center;text-align:center;gap:9px;padding:30px;border-radius:24px;background:#0b3d2e;color:#fff}.service-status-card i,.service-unavailable i{font-size:42px}.service-status-card span{color:rgba(255,255,255,.7)}
.service-unavailable{min-height:250px;background:linear-gradient(145deg,#eef6f2,#fff);border:1px solid #dce9e2;color:var(--text)}.service-unavailable p{color:var(--muted)}
.service-pill{display:inline-flex;align-items:center;padding:8px 13px;border-radius:999px;font-size:12px;font-weight:800}.service-pill.is-on{background:#dff6e9;color:#087a43}.service-pill.is-off{background:#fde7e7;color:#b42318}
.store-search{display:grid;grid-template-columns:minmax(0,1fr) 220px auto;gap:10px;margin-bottom:18px}.store-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:18px;align-items:start}
.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}.product-card{display:flex;flex-direction:column;gap:7px;padding:13px;border:1px solid #e0e9e4;border-radius:20px;background:#fff;box-shadow:0 10px 28px rgba(11,61,46,.06)}.product-card h3{margin:0;font-size:17px}.product-card p,.product-card small{margin:0;color:var(--muted)}.product-image{display:grid;place-items:center;aspect-ratio:1.25;border-radius:15px;background:#edf6f1;overflow:hidden;color:var(--primary);font-size:36px}.product-image img{width:100%;height:100%;object-fit:cover}.product-price{display:flex;align-items:center;justify-content:space-between;margin-top:auto}.product-price strong{font-size:18px;color:var(--primary)}.product-price span{font-size:11px;color:var(--muted)}
.cart-card{position:sticky;top:76px;padding:18px;border:1px solid #dce8e1;border-radius:22px;background:#fff;box-shadow:0 18px 45px rgba(11,61,46,.1)}.cart-card h2{display:flex;justify-content:space-between}.cart-card h2 span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--primary);color:#fff;font-size:13px}.cart-row{display:grid;grid-template-columns:minmax(0,1fr) 66px auto;gap:8px;align-items:center;padding:10px 0;border-bottom:1px solid #edf1ef}.cart-row div{display:flex;flex-direction:column}.cart-row small{color:var(--muted)}.cart-totals{display:grid;gap:7px;margin:16px 0}.cart-totals span,.cart-totals strong{display:flex;justify-content:space-between}.cart-totals strong{padding-top:10px;border-top:1px solid #dfe8e3;font-size:18px}
.order-card-list{display:grid;gap:10px}.order-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border:1px solid #e1e9e5;border-radius:16px;background:#fff}.order-card h3,.order-card p{margin:2px 0}.order-card>div{display:flex;min-width:0;flex-direction:column;gap:4px}.inventory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}.inventory-card{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;padding:12px;border:1px solid #e0e9e4;border-radius:16px}.inventory-card img{width:64px;height:64px;border-radius:12px;object-fit:cover}.inventory-card form{grid-column:1/-1;display:grid;grid-template-columns:90px 1fr auto;gap:8px;align-items:center}
.service-switch{display:flex;align-items:center;gap:9px;cursor:pointer}.service-switch input{position:absolute;opacity:0}.service-switch span{width:48px;height:27px;border-radius:20px;background:#cad7d0;padding:3px}.service-switch span:before{content:"";display:block;width:21px;height:21px;border-radius:50%;background:#fff;transition:.2s}.service-switch input:checked+span{background:#15935d}.service-switch input:checked+span:before{transform:translateX(21px)}.service-toggle-row{display:grid!important;grid-template-columns:minmax(0,1fr) 150px;align-items:center;gap:16px;padding:14px;border:1px solid #e1e9e5;border-radius:15px}.service-toggle-row span{display:grid;grid-template-columns:30px 1fr;gap:2px 8px}.service-toggle-row i{grid-row:1/3;font-size:22px;color:var(--primary)}.service-toggle-row small{color:var(--muted)}.rider-service-form{display:grid;gap:4px;font-size:12px}
.delivery-request-card{display:grid;gap:12px;max-width:720px;padding:24px;border-radius:24px;background:linear-gradient(145deg,#0b3d2e,#17694f);color:#fff;box-shadow:0 24px 60px rgba(11,61,46,.22)}.delivery-request-card p{margin:0;color:rgba(255,255,255,.82)}.delivery-request-card>div{display:flex;flex-direction:column}.delivery-active{max-width:780px}.delivery-route{display:grid;gap:14px;margin:18px 0}.delivery-route>div{display:grid;grid-template-columns:42px 1fr;gap:10px}.delivery-route i{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--primary-soft);color:var(--primary)}.delivery-route span{display:flex;flex-direction:column}.delivery-route small{color:var(--muted)}
@media(max-width:900px){.grocery-hero,.store-layout{grid-template-columns:1fr}.cart-card{position:static}.service-status-card{min-height:190px}}
@media(max-width:620px){.grocery-hero{padding:24px 18px;border-radius:20px}.store-search{grid-template-columns:1fr}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.product-card{padding:10px;border-radius:16px}.product-card h3{font-size:15px}.order-card{align-items:flex-start;flex-direction:column}.service-toggle-row{grid-template-columns:1fr}.inventory-grid{grid-template-columns:1fr}}
/* Grocery-only home, rider starter kit and compact mobile navigation */
.grocery-home-card{display:grid;gap:14px;padding:30px;border-radius:25px;background:linear-gradient(145deg,#0b3d2e,#17694f);color:#fff;box-shadow:0 22px 54px rgba(11,61,46,.2)}
.grocery-home-card p{margin:0;color:rgba(255,255,255,.76)}.grocery-home-card a{color:#fff;font-weight:800}.grocery-home-icon{display:grid;width:66px;height:66px;place-items:center;border-radius:20px;background:rgba(255,255,255,.13);font-size:31px}
.grocery-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.grocery-steps article{padding:22px;border:1px solid var(--line);border-radius:19px;background:#fff}.grocery-steps i{display:grid;width:44px;height:44px;place-items:center;margin-bottom:14px;border-radius:14px;background:var(--primary-soft);color:var(--primary);font-size:20px}.grocery-steps h3{font-size:17px}.grocery-steps p{margin:0;color:var(--muted);font-size:13px}
.rider-kit-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.65fr);gap:24px;margin-bottom:20px;border-left:4px solid #e7a51a}.rider-kit-card.is-cleared{border-left-color:var(--success)}
@media(max-width:991px){
 .app-navbar{padding:8px 0;background:rgba(255,255,255,.96);backdrop-filter:blur(14px);box-shadow:0 8px 28px rgba(11,61,46,.08)}
 .app-navbar>.container{min-height:52px}.app-navbar .brand-mark img{width:40px;height:40px;border-radius:12px}.app-navbar .brand-mark{font-size:18px}
 .navbar-toggler{width:44px;height:44px;padding:10px;border:1px solid var(--line)!important;border-radius:13px;background:var(--primary-soft)}.navbar-toggler:focus{box-shadow:0 0 0 3px rgba(11,61,46,.12)}
 .navbar-collapse{max-height:calc(100dvh - 82px);margin-top:10px;padding:10px;overflow-y:auto;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 18px 45px rgba(11,61,46,.12)}
 .navbar-nav{align-items:stretch!important;gap:3px}.navbar .nav-link{padding:11px 13px;border-radius:11px;font-size:14px}.navbar .nav-link.active,.navbar .nav-link:hover{background:var(--primary-soft)}.navbar-nav .btn{width:100%;margin-top:4px}
 .rider-kit-card{grid-template-columns:1fr}.grocery-steps{grid-template-columns:1fr}
}
@media(max-width:640px){
 .panel-main{padding:18px 14px 96px}.panel-topbar{padding:9px 13px}.panel-topbar .brand-mark span{font-size:15px}.panel-user>span{display:none}
 .bottom-nav{left:8px;right:8px;bottom:8px;width:auto;min-height:68px;border:1px solid var(--line);border-radius:21px;background:rgba(255,255,255,.97);box-shadow:0 14px 42px rgba(11,61,46,.2);padding-bottom:env(safe-area-inset-bottom);overflow:hidden}
 .bottom-nav a{min-width:0;min-height:66px;padding:9px 2px 7px;font-size:10px}.bottom-nav a i{font-size:19px}.bottom-nav a.active{background:var(--primary-soft)}
 .grocery-home-hero{padding:25px 18px}.grocery-home-hero h1{font-size:36px}.grocery-home-card{padding:22px}.product-card .btn{padding-left:8px;padding-right:8px}
}
/* Dual-service availability UI */
.dual-service-hero{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);gap:28px;align-items:center;padding:40px;border:1px solid #dfe9e4;border-radius:28px;background:radial-gradient(circle at 88% 5%,rgba(23,139,91,.16),transparent 38%),#fff;box-shadow:0 22px 70px rgba(11,61,46,.1)}
.dual-service-copy h1{max-width:760px;margin:10px 0 14px;font-size:clamp(38px,6vw,68px);line-height:1.03;color:var(--primary)}.dual-service-copy>p{max-width:660px;color:var(--muted);font-size:18px}
.service-priority-card{display:grid;gap:10px;padding:28px;border-radius:24px;background:linear-gradient(145deg,#0b3d2e,#17694f);color:#fff;box-shadow:0 22px 54px rgba(11,61,46,.2)}.service-priority-card>strong{display:grid;width:54px;height:54px;place-items:center;border-radius:17px;background:rgba(255,255,255,.13);font:800 24px Manrope,sans-serif}.service-priority-card h2,.service-priority-card p{margin:0}.service-priority-card p{color:rgba(255,255,255,.74)}.service-priority-card .section-eyebrow{color:#bde9d5}
.service-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.service-choice{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr);gap:18px;padding:26px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:var(--shadow-sm);overflow:hidden}.service-choice-icon{display:grid;width:60px;height:60px;place-items:center;border-radius:18px;background:var(--primary-soft);color:var(--primary);font-size:27px}.service-choice h2{margin:10px 0 7px;font-size:24px}.service-choice p{min-height:63px;color:var(--muted);font-size:14px}.service-rank{position:absolute;top:16px;right:18px;color:rgba(11,61,46,.12);font:800 48px/1 Manrope,sans-serif}.service-choice.is-locked{background:#f5f7f6;box-shadow:none}.service-choice.is-locked .service-choice-icon{background:#e8ecea;color:#7b8782}.service-choice.is-locked:after{content:"Locked";position:absolute;right:-28px;bottom:16px;width:120px;padding:5px 0;transform:rotate(-40deg);background:#53635c;color:#fff;text-align:center;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
@media(max-width:900px){.dual-service-hero,.service-choice-grid{grid-template-columns:1fr}.service-choice p{min-height:0}}
@media(max-width:620px){.dual-service-hero{padding:25px 18px;border-radius:21px}.dual-service-copy h1{font-size:37px}.service-priority-card{padding:22px}.service-choice{grid-template-columns:52px minmax(0,1fr);gap:13px;padding:20px 16px}.service-choice-icon{width:50px;height:50px;border-radius:15px;font-size:23px}.service-choice h2{font-size:21px}}
/* Rider identity, unified work inbox and 2026 typography polish */
body,input,button,select,textarea{font-family:"DM Sans",sans-serif}h1,h2,h3,h4,h5,h6,.brand-mark,.btn{font-family:"Plus Jakarta Sans",sans-serif}.panel-main{max-width:1240px}.panel-card,.table-card{border-color:#dfe8e3}.form-control,.form-select{min-height:46px;border-color:#d8e3dd;border-radius:12px;background:#fbfdfc}.form-control:focus,.form-select:focus{border-color:#2c8a68;box-shadow:0 0 0 4px rgba(44,138,104,.11)}
.rider-profile-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:16px;padding:28px;border-radius:26px;background:linear-gradient(135deg,#082f24,#0b4a37 58%,#17694f);color:#fff;box-shadow:0 22px 56px rgba(11,61,46,.2);overflow:hidden}.rider-identity{display:flex;align-items:center;gap:20px;min-width:0}.rider-avatar{position:relative;display:grid;width:112px;height:112px;flex:0 0 auto;place-items:center;border:4px solid rgba(255,255,255,.9);border-radius:31px;background:#dcebe4;color:var(--primary);font:800 42px "Plus Jakarta Sans",sans-serif;box-shadow:0 14px 28px rgba(0,0,0,.2)}.rider-avatar img{width:100%;height:100%;border-radius:27px;object-fit:cover}.rider-avatar>i{position:absolute;right:-7px;bottom:-7px;display:grid;width:32px;height:32px;place-items:center;border:3px solid #0b4a37;border-radius:50%;background:#fff;color:#25a96b;font-size:20px}.rider-identity h2{margin:7px 0 5px;font-size:30px}.rider-identity p{margin:9px 0 0;color:rgba(255,255,255,.76)}.rider-id-number{display:inline-flex;padding:5px 10px;border-radius:99px;background:rgba(255,255,255,.12);font:700 11px "Plus Jakarta Sans",sans-serif;letter-spacing:.12em}.rider-stars{display:flex;align-items:center;gap:4px;color:#ffc94a}.rider-stars b{margin-left:5px;color:inherit}.rider-stars small{margin-left:3px;color:rgba(255,255,255,.63)}.rider-qr-panel{display:flex;align-items:center;gap:14px;padding:13px;border:1px solid rgba(255,255,255,.16);border-radius:20px;background:rgba(255,255,255,.1);backdrop-filter:blur(8px)}.rider-qr-panel #riderQr{display:grid;width:128px;height:128px;place-items:center;padding:6px;border-radius:12px;background:#fff}.rider-qr-panel canvas,.rider-qr-panel img{max-width:100%;height:auto!important}.rider-qr-panel div:last-child{display:flex;flex-direction:column;gap:4px}.rider-qr-panel small{color:rgba(255,255,255,.65)}
.profile-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}.profile-stat-grid article{display:grid;grid-template-columns:42px 1fr;gap:1px 12px;padding:18px;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:var(--shadow-sm)}.profile-stat-grid i{grid-row:1/3;display:grid;width:42px;height:42px;place-items:center;border-radius:13px;background:var(--primary-soft);color:var(--primary);font-size:19px}.profile-stat-grid span{color:var(--muted);font-size:12px}.profile-stat-grid strong{font-size:21px;color:var(--ink)}.rider-profile-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:18px}.profile-side-stack{display:grid;gap:18px;align-content:start}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:16px}.card-heading h2{margin:2px 0 0;font-size:21px}.card-heading>i{display:grid;width:42px;height:42px;place-items:center;border-radius:13px;background:var(--primary-soft);color:var(--primary);font-size:19px}.document-list{display:grid;gap:9px}.document-list article{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px;border-radius:13px;background:#f5f9f7}.document-list article>i{display:grid;width:36px;height:36px;place-items:center;border-radius:11px;background:#fff;color:var(--primary)}.document-list span{display:flex;min-width:0;flex-direction:column}.document-list small{color:var(--muted)}.doc-status{padding:5px 8px;border-radius:99px;background:#fff1d6;color:#985e00;font-size:10px;font-style:normal;font-weight:800;text-transform:capitalize}.doc-status.verified{background:#ddf5e8;color:#087a43}.doc-status.rejected{background:#fde5e5;color:#b42318}.profile-service-card{display:grid;gap:10px}.profile-service-card>div{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}.profile-service-card>div:last-child{border:0}.profile-service-card span{display:flex;gap:8px;color:var(--muted)}
.unified-request-feed{display:grid;gap:12px}.request-priority-head{display:flex;align-items:center;gap:12px;margin-top:2px;padding:4px 2px}.request-priority-head.second{margin-top:10px}.request-priority-head>span{padding:5px 9px;border-radius:99px;background:var(--primary);color:#fff;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.request-priority-head h2{display:flex;align-items:center;gap:8px;margin:0;font-size:20px}.request-priority-head small{margin-left:auto;color:var(--muted)}.unified-request-card{padding:24px;border:1px solid #bedacc;border-radius:22px;background:linear-gradient(145deg,#fff,#f3faf7);box-shadow:0 16px 38px rgba(11,61,46,.09)}.unified-request-card.grocery-request{border-color:#d9dfbc;background:linear-gradient(145deg,#fff,#fafbed)}.request-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.request-card-top h2{margin:8px 0 0}.request-card-top>strong{font-size:25px;color:var(--primary)}.request-route{display:grid;gap:12px;margin:20px 0}.request-route>div{display:grid;grid-template-columns:36px 1fr;gap:10px}.request-route>div>i{display:grid;width:36px;height:36px;place-items:center;border-radius:11px;background:#fff;color:var(--primary);box-shadow:var(--shadow-sm)}.request-route span{display:flex;min-width:0;flex-direction:column}.request-route small{color:var(--muted)}.request-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px}.request-empty{display:flex;align-items:center;gap:13px;padding:19px;border:1px dashed #cddbd4;border-radius:17px;background:#f8fbf9;color:var(--muted)}.request-empty>i{display:grid;width:44px;height:44px;place-items:center;border-radius:14px;background:#eaf3ee;color:var(--primary);font-size:20px}.request-empty span{display:flex;flex-direction:column}.request-empty b{color:var(--ink)}.request-history-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.request-history-tabs h3{font-size:16px}.request-history-tabs article{display:flex;justify-content:space-between;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}.request-history-tabs article span{display:flex;min-width:0;flex-direction:column}.request-history-tabs small{max-width:380px;overflow:hidden;color:var(--muted);text-overflow:ellipsis;white-space:nowrap}.request-history-tabs em{height:max-content;padding:4px 7px;border-radius:99px;background:var(--primary-soft);color:var(--primary);font-size:10px;font-style:normal;font-weight:700}
@media(max-width:900px){.rider-profile-hero{align-items:flex-start}.rider-profile-layout{grid-template-columns:1fr}.profile-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.request-history-tabs{grid-template-columns:1fr}}
@media(max-width:640px){.panel-title h1{font-size:25px}.rider-profile-hero{display:grid;padding:20px;border-radius:21px}.rider-identity{align-items:flex-start}.rider-avatar{width:78px;height:78px;border-radius:23px;font-size:30px}.rider-avatar img{border-radius:19px}.rider-identity h2{font-size:22px}.rider-identity p{font-size:12px}.rider-qr-panel{justify-content:center}.rider-qr-panel #riderQr{width:104px;height:104px}.profile-stat-grid{gap:8px}.profile-stat-grid article{grid-template-columns:34px 1fr;padding:13px 11px}.profile-stat-grid i{width:34px;height:34px}.profile-stat-grid strong{font-size:17px}.unified-request-card{padding:18px 15px}.request-card-top>strong{font-size:20px}.request-actions{grid-template-columns:1fr}.request-priority-head small{display:none}.form-grid{grid-template-columns:1fr}}.unified-request-link{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:14px}.unified-request-link>i{display:grid;width:48px;height:48px;place-items:center;border-radius:15px;background:var(--primary-soft);color:var(--primary);font-size:21px}.unified-request-link h2,.unified-request-link p{margin:0}.unified-request-link p{color:var(--muted)}
@media(max-width:640px){.unified-request-link{grid-template-columns:44px 1fr}.unified-request-link>a{grid-column:1/-1;width:100%}}
/* Professional panel navigation, admin data layout and grocery map */
.panel-topbar{position:sticky;top:0;z-index:1300;min-height:72px;padding:11px clamp(16px,3vw,34px);background:rgba(7,55,41,.98);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 10px 30px rgba(7,42,32,.14)}.panel-topbar .brand-mark img{width:42px;height:42px;padding:5px;border-radius:13px;background:rgba(255,255,255,.1)}.panel-topbar .brand-mark span{font-size:19px}.panel-user{gap:14px}.panel-user>span{font-weight:650;color:rgba(255,255,255,.78)}
.panel-tabs{position:relative;margin:-4px 0 24px;border-bottom:1px solid #dfe7e3}.panel-tabs-track{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none}.panel-tabs-track::-webkit-scrollbar{display:none}.panel-tab{position:relative;flex:0 0 auto;padding:13px 1px;color:#60716a;font:700 13px "Plus Jakarta Sans",sans-serif;text-decoration:none}.panel-tab:after{content:"";position:absolute;right:0;bottom:-1px;left:0;height:3px;border-radius:3px 3px 0 0;background:transparent}.panel-tab:hover{color:var(--primary)}.panel-tab.active{color:var(--primary)}.panel-tab.active:after{background:var(--primary)}
.role-admin{background:#f4f7f5}.role-admin .panel-main{max-width:1480px;padding-top:24px}.role-admin .panel-title{margin-bottom:22px}.role-admin .panel-title h1{font-size:clamp(30px,3vw,42px);letter-spacing:-.04em}.role-admin .table-card{padding:18px 20px;overflow-x:auto;border:1px solid #dce6e1;border-radius:20px;background:#fff;box-shadow:0 10px 32px rgba(11,61,46,.06)}.role-admin .table{min-width:1120px;margin:0}.role-admin .table thead th{padding:12px 10px;border-bottom:1px solid #dbe5e0;color:#64736d;font-size:10px;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}.role-admin .table tbody td{padding:16px 10px;vertical-align:middle;border-color:#e8eeeb;font-size:13px}.role-admin .table .btn{min-height:34px;padding:7px 10px;border-radius:9px;font-size:11px}.role-admin .rider-service-form{min-width:115px}.role-admin .rider-service-form label{display:flex;align-items:center;gap:6px}.role-admin .form-control-sm{min-height:36px}.role-admin td:last-child{min-width:310px}.role-admin td:last-child form{align-items:center}.role-admin td:last-child .form-control{flex:1 1 135px;width:135px}.role-admin .badge-soft{white-space:nowrap}
.delivery-location-map{width:100%;height:260px;overflow:hidden;border:1px solid #cfddd6;border-radius:17px;background:#eaf1ed;isolation:isolate}.delivery-location-map .leaflet-control-attribution{font-size:8px}.delivery-map-status{display:flex;align-items:flex-start;gap:8px;padding:10px 12px;border-radius:12px;background:#edf6f1;color:var(--primary);font-size:12px}.delivery-map-status i{margin-top:1px}.grocery-checkout-form{padding-top:6px;border-top:1px solid var(--line)}.cart-totals strong b{font-size:20px;color:var(--primary)}.grocery-pricing-settings{padding:14px;border-radius:15px;background:#f4f8f6}
@media(max-width:767px){.panel-topbar{min-height:62px;padding:8px 12px}.panel-topbar .brand-mark img{width:38px;height:38px}.panel-tabs{margin-bottom:18px}.panel-tabs-track{gap:20px}.panel-tab{padding:11px 0}.role-admin .panel-main{padding:16px 12px 88px}.role-admin .table-card{padding:12px;border-radius:16px}.delivery-location-map{height:230px}}
.grocery-order-map{width:100%;height:260px;margin:16px 0;border:1px solid #cfddd6;border-radius:17px;overflow:hidden;isolation:isolate}.grocery-order-map .leaflet-control-attribution{font-size:8px}


/* Rider starter kit and delivery-map polish */
.rider-kit-card{display:grid;grid-template-columns:minmax(0,.82fr) minmax(420px,1.18fr);gap:0;margin-bottom:24px;padding:0!important;overflow:hidden;border:1px solid #dce7e1!important;border-left:1px solid #dce7e1!important;border-radius:24px;background:#fff;box-shadow:0 16px 44px rgba(8,55,41,.08)}
.rider-kit-card.is-cleared{border-color:#bfe2d1!important}.rider-kit-summary{position:relative;padding:28px;background:linear-gradient(145deg,#083e2f 0%,#0b5b43 100%);color:#fff}.rider-kit-summary:after{content:"";position:absolute;right:-42px;bottom:-70px;width:190px;height:190px;border:38px solid rgba(255,255,255,.05);border-radius:50%}
.rider-kit-heading{position:relative;z-index:1;display:flex;align-items:center;gap:13px}.rider-kit-heading .kit-icon{display:grid;width:48px;height:48px;place-items:center;border-radius:15px;background:rgba(255,255,255,.13);font-size:22px}.rider-kit-heading .section-eyebrow{color:#a9dcc8}.rider-kit-heading h2{margin:3px 0 0;color:#fff;font-size:24px}.kit-price{position:relative;z-index:1;display:flex;align-items:end;justify-content:space-between;gap:16px;margin:26px 0 20px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.14)}.kit-price span{color:#b9d9cd;font-size:13px}.kit-price strong{font:750 31px "Plus Jakarta Sans",sans-serif;letter-spacing:-.04em}
.kit-items{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:8px}.kit-item{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.08);font-size:12px}.kit-item i{color:#8ee1bd}.kit-note{position:relative;z-index:1;display:flex;gap:9px;margin:20px 0 0;color:#c9ded6;font-size:12px;line-height:1.55}.kit-note i{margin-top:2px}
.rider-kit-payment{padding:26px 28px}.payment-status-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.payment-status-row>div{display:grid;gap:2px}.payment-kicker{color:var(--muted);font-size:11px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.payment-status-row strong{font-size:18px}.payment-status-row .badge-soft{display:inline-flex;align-items:center;gap:6px}.payment-review-form{display:grid;gap:16px}.payment-review-form fieldset{min-width:0;margin:0;padding:0;border:0}.payment-review-form legend{margin-bottom:10px;font-size:13px;font-weight:750}
.payment-method-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.payment-method-option{position:relative;display:grid;grid-template-columns:38px 1fr 18px;align-items:center;gap:10px;min-width:0;padding:11px;border:1px solid #dce6e1;border-radius:14px;background:#fbfdfc;cursor:pointer;transition:.18s ease}.payment-method-option:hover{border-color:#94b8a8;background:#f6faf8}.payment-method-option:has(input:checked){border-color:var(--primary);background:#eef7f3;box-shadow:0 0 0 2px rgba(11,61,46,.07)}.payment-method-option input{position:absolute;opacity:0;pointer-events:none}.payment-method-icon{display:grid;width:38px;height:38px;place-items:center;border-radius:11px;background:#e7f1ec;color:var(--primary);font-size:17px}.payment-method-option>span:nth-child(3){min-width:0}.payment-method-option strong,.payment-method-option small{display:block}.payment-method-option strong{overflow:hidden;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.payment-method-option small{margin-top:2px;color:var(--muted);font-size:10px}.payment-method-check{color:var(--primary);opacity:0}.payment-method-option:has(input:checked) .payment-method-check{opacity:1}
.manual-payment-note{display:flex;gap:9px;padding:10px 12px;border-radius:12px;background:#f1f7f4;color:#355c4c;font-size:11px;line-height:1.5}.manual-payment-note i{margin-top:2px}.payment-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.payment-fields label{font-size:12px;font-weight:700}.payment-fields label small{float:right;color:var(--muted);font-weight:500}.payment-fields .form-control{margin-top:6px}.kit-approved,.payment-unavailable{display:flex;align-items:flex-start;gap:13px;padding:18px;border-radius:16px;background:#edf8f2;color:#135b40}.kit-approved>i,.payment-unavailable>i{font-size:24px}.kit-approved p,.payment-unavailable p{margin:3px 0 0;font-size:12px}.payment-unavailable{background:#fff7e8;color:#805a0b}
.delivery-location-map,.grocery-order-map{border:4px solid #fff!important;border-radius:20px!important;background:linear-gradient(135deg,#e7f1ec,#dbe9e2)!important;box-shadow:0 0 0 1px #d9e5df,0 14px 32px rgba(8,55,41,.11)}.delivery-location-map .leaflet-control-zoom,.grocery-order-map .leaflet-control-zoom{overflow:hidden;border:0!important;border-radius:11px!important;box-shadow:0 5px 16px rgba(8,55,41,.15)!important}.delivery-map-status{margin-top:10px;border:1px solid #dbe9e2;background:linear-gradient(135deg,#f2f8f5,#eaf5ef);font-weight:600}
@media(max-width:991px){.rider-kit-card{grid-template-columns:1fr}.rider-kit-summary,.rider-kit-payment{padding:23px}.payment-method-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.rider-kit-card{border-radius:19px}.rider-kit-summary,.rider-kit-payment{padding:19px}.kit-price{margin:21px 0 17px}.kit-price strong{font-size:27px}.payment-method-grid,.payment-fields{grid-template-columns:1fr}.payment-status-row{align-items:flex-start}.payment-status-row .badge-soft{font-size:10px}}


/* Per-panel branding manager */
.panel-wide{grid-column:1/-1}.branding-manager{padding:26px}.branding-manager-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}.branding-manager-head h2{margin:4px 0 6px}.branding-manager-head .badge-soft{display:inline-flex;align-items:center;gap:6px}.branding-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.branding-card{display:grid;align-content:start;gap:14px;padding:17px;border:1px solid #dce6e1;border-radius:18px;background:linear-gradient(145deg,#fff,#f8fbf9)}.branding-card-title{display:flex;align-items:center;gap:11px;padding-bottom:13px;border-bottom:1px solid #e4ebe7}.branding-card-title>div{min-width:0}.branding-card-title strong,.branding-card-title small{display:block}.branding-card-title small{margin-top:3px;overflow:hidden;color:var(--muted);font-size:10px;text-overflow:ellipsis;white-space:nowrap}.branding-preview{display:grid;flex:0 0 52px;width:52px;height:52px;place-items:center;overflow:hidden;border-radius:14px;background:#0b3d2e}.branding-preview img{width:100%;height:100%;padding:6px;object-fit:contain}.branding-card label{font-size:12px;font-weight:700}.branding-card label>small{float:right;color:var(--muted);font-weight:500}.branding-card .form-control{margin-top:6px;font-size:11px}.favicon-upload-row{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:8px;margin-top:6px}.favicon-upload-row .form-control{margin:0}.favicon-preview{display:grid;width:42px;height:42px;place-items:center;overflow:hidden;border:1px solid #dce6e1;border-radius:11px;background:#fff}.favicon-preview img{width:28px;height:28px;object-fit:contain}.branding-reset{display:flex;align-items:center;gap:7px;margin-top:2px;color:#66766f;font-weight:600!important}.branding-reset input{width:16px;height:16px;accent-color:var(--primary)}
@media(max-width:1100px){.branding-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:650px){.branding-manager{padding:18px}.branding-manager-head{display:grid}.branding-grid{grid-template-columns:1fr}.branding-card{padding:15px}}

/* Admin account inspection and editing */
.admin-edit-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px;padding:24px 26px;border:1px solid #dce6e1;border-radius:22px;background:linear-gradient(135deg,#fff,#f1f7f4);box-shadow:0 12px 34px rgba(8,55,41,.06)}.admin-edit-header h1{margin:5px 0 2px;font-size:clamp(27px,3vw,39px);letter-spacing:-.04em}.admin-edit-header p{margin:0;color:var(--muted)}.admin-edit-header>a,.admin-edit-header div>a{font-size:12px;font-weight:800}.admin-stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:18px}.admin-stat-row article{padding:17px 18px;border:1px solid #dfe8e3;border-radius:17px;background:#fff;box-shadow:0 7px 24px rgba(8,55,41,.05)}.admin-stat-row span{display:block;color:var(--muted);font-size:11px;font-weight:750;text-transform:uppercase;letter-spacing:.06em}.admin-stat-row strong{display:block;margin-top:5px;color:var(--primary);font-size:21px}.admin-edit-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(310px,.65fr);gap:18px;align-items:start}.admin-form-section{padding:22px!important;border-radius:20px!important}.admin-form-section h2{margin:0 0 6px;font-size:20px}.admin-form-section>p,.admin-form-section .card-heading p{color:var(--muted);font-size:12px}.admin-form-section .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.admin-form-section label{display:grid;gap:6px;color:#334b40;font-size:12px;font-weight:750}.admin-form-section label small{color:var(--muted);font-weight:500}.admin-form-section textarea.form-control{min-height:92px}.check-card{display:flex!important;align-items:center;gap:9px!important;min-height:46px;padding:11px 13px;border:1px solid #d8e3dd;border-radius:12px;background:#f8fbf9}.check-card input{width:17px;height:17px;accent-color:var(--primary)}.admin-data-list p{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font-size:12px}.admin-data-list span{color:var(--muted)}.admin-data-list strong{text-align:right}.admin-list-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}.admin-list-row span{display:flex;min-width:0;flex-direction:column}.admin-list-row small{color:var(--muted)}.admin-doc-upload{display:grid;grid-template-columns:220px minmax(0,1fr) auto;gap:10px;margin:17px 0}.admin-document-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.admin-document-grid article{display:grid;gap:12px;padding:15px;border:1px solid #dfe8e3;border-radius:16px;background:#f9fbfa}.admin-document-grid article>div{display:flex;align-items:center;justify-content:space-between;gap:8px}.admin-document-grid article>a{font-size:12px;font-weight:800}.role-admin .admin-edit-grid .table{min-width:560px}.role-admin .admin-edit-grid td:last-child{min-width:0}
@media(max-width:980px){.admin-edit-grid{grid-template-columns:1fr}.admin-document-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){.admin-edit-header{align-items:flex-start;padding:19px}.admin-stat-row{grid-template-columns:repeat(2,minmax(0,1fr))}.admin-form-section .form-grid{grid-template-columns:1fr}.admin-doc-upload{grid-template-columns:1fr}.admin-document-grid{grid-template-columns:1fr}.admin-form-section{padding:17px!important}}
/* User ride card and profile actions */
.role-user .panel-grid{align-items:start}.role-user [data-user-ride-state]{min-width:0;overflow:hidden}.rider-arrival-card .rider-avatar{width:64px;height:64px;border:0;border-radius:18px;font-size:25px;box-shadow:none}.rider-arrival-card .rider-avatar img{width:100%;height:100%;border-radius:18px;object-fit:cover}.rider-arrival-card{grid-template-columns:64px minmax(0,1fr) auto;box-shadow:0 10px 28px rgba(11,61,46,.06)}.profile-account-actions{display:grid;gap:0}.profile-account-actions h2{margin:0 0 8px}.profile-account-actions a{display:grid;grid-template-columns:36px minmax(0,1fr) 18px;align-items:center;gap:10px;padding:13px 0;border-top:1px solid var(--line);color:var(--ink);text-decoration:none}.profile-account-actions a>i:first-child{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:var(--primary-soft);color:var(--primary)}.profile-account-actions span{display:grid;gap:2px}.profile-account-actions small{color:var(--muted);font-size:11px}.profile-account-actions>.logout-action{color:#b42318}.profile-account-actions>.logout-action>i:first-child{background:#fde8e7;color:#b42318}@media(max-width:620px){.rider-arrival-card{grid-template-columns:56px minmax(0,1fr)}.rider-arrival-card .rider-avatar{width:56px;height:56px;border-radius:16px}.rider-arrival-card .rider-avatar img{border-radius:16px}.rider-arrival-card .btn{grid-column:1/-1;width:100%}}
/* Wallet-first payment experience */
.header-wallet{display:flex;align-items:center;gap:8px;padding:7px 8px 7px 12px;border:1px solid rgba(255,255,255,.28);border-radius:13px;background:rgba(255,255,255,.1);color:#fff!important;font-weight:800;text-decoration:none}.header-wallet b{display:grid;width:22px;height:22px;place-items:center;border-radius:8px;background:#fff;color:var(--primary);font-size:17px}.wallet-hero{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;padding:26px;border-radius:24px;background:linear-gradient(135deg,#082f24,#126447);color:#fff;box-shadow:0 18px 44px rgba(8,55,41,.18)}.wallet-hero .section-eyebrow{color:#a9dcc8}.wallet-hero h1{margin:6px 0;font-size:38px;color:#fff}.wallet-hero p{margin:0;color:#d0e5dc}.wallet-layout{display:grid;grid-template-columns:minmax(290px,.75fr) minmax(0,1.25fr);gap:18px;align-items:start}.wallet-topup{padding:24px!important;border-radius:22px!important}.wallet-topup h2{margin:0 0 5px}.wallet-topup>p{color:var(--muted);font-size:13px}.payment-checkout-card{width:min(540px,100%);margin:48px auto;padding:30px;border:1px solid #dce7e1;border-radius:26px;background:#fff;text-align:center;box-shadow:0 24px 64px rgba(8,55,41,.13)}.payment-checkout-card h1{margin:15px 0 8px}.payment-checkout-card p{color:var(--muted)}.payment-amount{margin:20px 0;padding:16px;border-radius:16px;background:#edf7f2;color:var(--primary);font-size:30px;font-weight:850}.payment-checkout-card small{display:block;margin-top:13px;color:var(--muted)}@media(max-width:720px){.wallet-hero{align-items:flex-start;flex-direction:column;padding:21px}.wallet-hero h1{font-size:32px}.wallet-layout{grid-template-columns:1fr}.header-wallet span{font-size:12px}}
/* App-style grocery storefront */
.grocery-app-head{display:grid;grid-template-columns:1fr auto;gap:15px;margin:-22px -16px 0;padding:24px 24px 72px;border-radius:0 0 28px 28px;background:radial-gradient(circle at 80% 10%,#12724f,#053d2c 55%,#062f24);color:#fff}.grocery-brand{display:flex;align-items:center;gap:10px}.grocery-brand>i{display:grid;width:42px;height:42px;place-items:center;border-radius:14px;background:rgba(255,255,255,.13);font-size:22px}.grocery-brand strong,.grocery-brand span{display:block}.grocery-brand strong{font-size:22px}.grocery-brand span{color:#cfe6dc;font-size:12px}.grocery-bell{display:grid;width:42px;height:42px;place-items:center;border:1px solid rgba(255,255,255,.22);border-radius:14px;color:#fff;font-size:20px}.grocery-location{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:13px 15px;border-radius:16px;background:rgba(255,255,255,.11);font-weight:700}.grocery-location span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.grocery-search{position:relative;z-index:2;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin:-40px 0 22px;padding:8px 11px 8px 17px;border:1px solid #e1e9e4;border-radius:20px;background:#fff;box-shadow:0 14px 30px rgba(8,55,41,.12)}.grocery-search>i{font-size:22px}.grocery-search input{min-width:0;border:0;outline:0;font-size:16px}.grocery-search button{display:grid;width:42px;height:42px;place-items:center;border:0;border-radius:14px;background:#edf5f0;color:var(--primary);font-size:19px}.grocery-offer{display:flex;align-items:center;justify-content:space-between;min-height:220px;padding:25px 28px;border-radius:24px;background:radial-gradient(circle at 82% 25%,rgba(104,218,124,.45),transparent 13%),linear-gradient(120deg,#063e2f,#07513b);color:#fff;overflow:hidden}.grocery-offer span{display:inline-block;padding:6px 9px;border-radius:8px;background:#19a653;font-size:11px;font-weight:850;text-transform:uppercase}.grocery-offer h2{margin:16px 0 7px;color:#fff;font-size:30px}.grocery-offer h2 b{color:#89ed84}.grocery-offer p{color:#d1e8dd}.grocery-offer a{display:inline-flex;gap:10px;align-items:center;padding:10px 14px;border-radius:11px;background:#fff;color:#09432f;font-weight:850}.grocery-offer>i{margin-right:4%;font-size:112px;color:rgba(163,241,124,.77);transform:rotate(-10deg)}.grocery-categories{display:flex;gap:10px;overflow-x:auto;padding:20px 4px}.grocery-categories a{display:grid;flex:0 0 92px;min-height:92px;place-items:center;gap:6px;padding:9px;border:1px solid #e3ebe6;border-radius:16px;background:#fff;color:var(--ink);box-shadow:0 7px 18px rgba(8,55,41,.06);font-size:11px;font-weight:750;text-align:center}.grocery-categories i{display:grid;width:36px;height:36px;place-items:center;border-radius:12px;background:#eaf4ee;color:var(--primary);font-size:19px}.grocery-categories a.active{border-color:var(--primary);background:#eff8f2;color:var(--primary)}.grocery-section-title{display:flex;align-items:center;justify-content:space-between;margin:8px 0 14px}.grocery-section-title h2{margin:0;font-size:23px}.grocery-section-title a{color:var(--primary);font-weight:800}.grocery-product-grid{grid-template-columns:repeat(auto-fill,minmax(165px,1fr))}.grocery-product-card{position:relative;padding:12px;border-radius:18px}.grocery-product-card .product-image{aspect-ratio:1.1;background:#f1f7f3}.grocery-product-card h3{font-size:16px}.grocery-product-card form{position:absolute;right:12px;bottom:12px}.product-add{display:grid;width:34px;height:34px;place-items:center;border:1px solid var(--primary);border-radius:11px;background:#fff;color:var(--primary);font-size:18px}.grocery-product-card .product-price{padding-right:42px}.grocery-product-card p{font-size:11px}.grocery-product-card .product-price span{display:none}@media(max-width:620px){.grocery-app-head{margin:-15px -12px 0;padding:19px 16px 64px;border-radius:0 0 24px 24px}.grocery-brand strong{font-size:19px}.grocery-offer{min-height:194px;padding:20px}.grocery-offer h2{font-size:25px}.grocery-offer>i{font-size:82px}.grocery-categories a{flex-basis:78px;min-height:80px;font-size:10px}.grocery-product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.grocery-product-card .product-image{aspect-ratio:1}.grocery-product-card h3{font-size:14px}.grocery-product-card small{font-size:10px}.grocery-section-title h2{font-size:20px}}
/* Native Android / PWA safe-area: keep the panel header below the status bar. */
:root{--safe-area-top:env(safe-area-inset-top,0px)}.native-user-app{--native-safe-top:max(var(--safe-area-top),24px)}.native-user-app .panel-topbar{min-height:calc(58px + var(--native-safe-top));padding-top:calc(var(--native-safe-top) + 8px);padding-bottom:8px}.native-user-app .panel-main{padding-top:15px}@media(display-mode:standalone){.native-user-app .panel-topbar{min-height:calc(58px + var(--native-safe-top));padding-top:calc(var(--native-safe-top) + 8px)}}/* Grocery showcase artwork and dependable mobile safe-area spacing */
.grocery-offer>img{width:42%;max-width:360px;align-self:stretch;object-fit:cover;object-position:center;border-radius:18px;filter:drop-shadow(0 15px 20px rgba(0,0,0,.18))}.grocery-categories img{display:grid;width:36px;height:36px;place-self:center;object-fit:cover;border-radius:12px;background:#eaf4ee}.showcase-admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.showcase-card-heading{display:flex;gap:12px;align-items:flex-start;margin-bottom:6px}.showcase-card-heading>i{display:grid;width:42px;height:42px;place-items:center;flex:0 0 auto;border-radius:13px;background:var(--primary-soft);color:var(--primary);font-size:19px}.showcase-card-heading h2{margin:0;font-size:20px}.showcase-card-heading p{margin:4px 0 0;color:var(--muted);font-size:11px}.showcase-list,.category-admin-grid{display:grid;gap:10px}.showcase-list article,.category-admin-grid article{display:grid;grid-template-columns:82px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px;border:1px solid #e0e9e4;border-radius:16px;background:#fff}.showcase-list strong,.showcase-list small,.category-admin-grid strong,.category-admin-grid small{display:block}.showcase-list small,.category-admin-grid small{margin-top:3px;color:var(--muted);font-size:11px}.showcase-thumb{width:82px;height:48px;display:grid;place-items:center;overflow:hidden;border-radius:10px;background:linear-gradient(135deg,#063e2f,#13724f);color:#fff}.showcase-thumb img{width:100%;height:100%;object-fit:cover}.category-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.category-admin-grid article{grid-template-columns:54px minmax(0,1fr) auto}.category-admin-image{display:grid;width:54px;height:54px;place-items:center;overflow:hidden;border-radius:14px;background:#eaf4ee;color:var(--primary);font-size:21px}.category-admin-image img{width:100%;height:100%;object-fit:cover}
/* Android WebView may report 0px for env(safe-area-inset-top). This 32px minimum prevents status-bar overlap. */
:root{--app-safe-top:env(safe-area-inset-top,0px)}
@media(max-width:767px){body.role-user .panel-topbar{min-height:94px;padding-top:max(32px,calc(var(--app-safe-top) + 8px));padding-bottom:8px}body.role-user .panel-main{padding-top:15px}.native-user-app .panel-topbar{min-height:94px!important;padding-top:max(32px,calc(env(safe-area-inset-top,0px) + 8px))!important;padding-bottom:8px!important}.native-user-app .grocery-app-head{margin-top:-15px}.grocery-offer>img{width:44%;max-width:170px;border-radius:14px}.showcase-admin-grid,.category-admin-grid{grid-template-columns:1fr}.showcase-list article{grid-template-columns:72px minmax(0,1fr)}.showcase-list form{grid-column:1/-1}.showcase-list .showcase-thumb{width:72px}.category-admin-grid article{grid-template-columns:54px minmax(0,1fr)}.category-admin-grid form{grid-column:1/-1}}
@media(display-mode:standalone){@media(max-width:767px){body.role-user .panel-topbar{padding-top:max(32px,calc(env(safe-area-inset-top,0px) + 8px))}}}
/* Live-location grocery matching and offer-page cards */
.grocery-location{border:0;width:100%;color:#fff;text-align:left;cursor:pointer;transition:background .2s ease}.grocery-location:hover{background:rgba(255,255,255,.18)}.grocery-location:disabled{opacity:.75;cursor:wait}.nearby-store-note{display:flex;align-items:center;gap:11px;margin:4px 0 13px;padding:11px 13px;border:1px solid #cfe7da;border-radius:16px;background:linear-gradient(135deg,#eff8f3,#fff)}.nearby-store-note>i{display:grid;width:34px;height:34px;place-items:center;border-radius:11px;background:var(--primary);color:#fff}.nearby-store-note span{display:grid;min-width:0;flex:1}.nearby-store-note strong{font-size:13px;color:var(--primary)}.nearby-store-note small{margin-top:2px;color:var(--muted);font-size:11px}.nearby-store-note button{border:0;background:transparent;color:var(--primary);font-size:12px;font-weight:800}.grocery-offer-pages{margin:18px 0 4px}.grocery-offer-pages .grocery-section-title{margin-bottom:10px}.grocery-offer-pages .grocery-section-title span{color:var(--muted);font-size:11px;font-weight:700}.grocery-offer-page-track{display:flex;gap:12px;overflow-x:auto;padding:3px 2px 12px;scroll-snap-type:x proximity}.grocery-offer-page{position:relative;display:block;flex:0 0 min(310px,82vw);height:148px;overflow:hidden;border-radius:18px;background:#0b3d2e;color:#fff;box-shadow:0 10px 24px rgba(8,55,41,.12);scroll-snap-align:start}.grocery-offer-page:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,39,29,.78),rgba(3,39,29,.08) 70%)}.grocery-offer-page img{width:100%;height:100%;object-fit:cover}.grocery-offer-page span{position:absolute;z-index:1;left:15px;bottom:14px;max-width:70%;font-size:15px;font-weight:850;line-height:1.25}.grocery-offer-page-track::-webkit-scrollbar{display:none}@media(max-width:620px){.nearby-store-note{margin-top:0}.grocery-offer-page{height:128px;flex-basis:250px}}
/* Wallet top-up and redeem-code experience */
.wallet-payment-column{display:grid;gap:18px}.wallet-card-heading{display:flex;gap:12px;align-items:flex-start;margin-bottom:18px}.wallet-card-heading>i{display:grid;width:42px;height:42px;place-items:center;flex:0 0 auto;border-radius:14px;background:var(--primary-soft);color:var(--primary);font-size:19px}.wallet-card-heading h2{margin:0;font-size:21px}.wallet-card-heading p{margin:4px 0 0;color:var(--muted);font-size:12px}.wallet-quick-amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.wallet-quick-amounts button{min-height:42px;border:1px solid #d8e6df;border-radius:12px;background:#f7fbf9;color:var(--primary);font-weight:800}.wallet-quick-amounts button:hover{border-color:var(--primary);background:var(--primary-soft)}.wallet-redeem-card{border-color:#d7eade!important;background:linear-gradient(135deg,#fff,#f1fbf5)}.wallet-redeem-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px}.wallet-redeem-form input{text-transform:uppercase;letter-spacing:.08em;font-weight:800}.wallet-history{min-width:0}.wallet-coupon-gallery{margin-top:20px}.wallet-coupon-gallery>div:last-child{display:flex;gap:12px;overflow-x:auto;padding:2px 2px 10px}.wallet-coupon-banner{position:relative;display:grid;align-items:end;flex:0 0 min(340px,86vw);height:150px;overflow:hidden;padding:16px;border-radius:19px;background:linear-gradient(135deg,#073e2e,#15925d);color:#fff}.wallet-coupon-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,38,28,.8),rgba(3,38,28,.08))}.wallet-coupon-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.wallet-coupon-banner span{position:relative;z-index:1;display:grid;gap:2px}.wallet-coupon-banner small{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#bde7d1}.wallet-coupon-banner strong{font-size:19px}.wallet-coupon-banner em{font-size:11px;font-style:normal;color:#e2f4ea}@media(max-width:620px){.wallet-redeem-form{grid-template-columns:1fr}.wallet-redeem-form .btn{width:100%}.wallet-quick-amounts{gap:6px}.wallet-hero-upgraded{margin-bottom:14px}}
/* Consolidated grocery management */
.grocery-management-store-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(285px,1fr));gap:15px}.grocery-management-store-grid>article{padding:13px;border:1px solid #dfe9e4;border-radius:18px;background:#fff}.grocery-store-media{position:relative;height:110px;overflow:hidden;border-radius:14px;background:linear-gradient(135deg,#073d2e,#148456)}.grocery-store-media>img{width:100%;height:100%;object-fit:cover}.grocery-store-media>div{position:absolute;left:12px;bottom:10px;display:grid;width:44px;height:44px;place-items:center;overflow:hidden;border:3px solid #fff;border-radius:14px;background:#eaf4ee;color:var(--primary);font-size:20px}.grocery-store-media>div img{width:100%;height:100%;object-fit:cover}.grocery-management-store-grid h3{margin:12px 0 3px;font-size:18px}.grocery-management-store-grid p{margin:0 0 12px;color:var(--muted);font-size:11px}.grocery-management-store-grid p i{color:#e9a800}.store-media-form{display:grid;grid-template-columns:1fr 1fr auto;gap:7px;align-items:end}.store-media-form label{font-size:10px;font-weight:700}.store-media-form .form-control{margin-top:4px;padding:5px;font-size:9px}.admin-management-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.review-admin-list{display:grid;gap:10px}.review-admin-list article{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:11px;border-bottom:1px solid var(--line)}.review-admin-list strong,.review-admin-list small{display:block}.review-admin-list small{margin-top:2px;color:var(--muted);font-size:10px}.review-admin-list p{margin:6px 0 0;font-size:12px}@media(max-width:780px){.admin-management-grid{grid-template-columns:1fr}.store-media-form{grid-template-columns:1fr}.store-media-form .btn{width:100%}}
.grocery-live-poster{margin-bottom:18px}.poster-manager-form{display:grid;grid-template-columns:minmax(220px,.65fr) minmax(0,1fr);gap:18px;align-items:stretch}.poster-preview{display:grid;min-height:205px;place-items:center;overflow:hidden;border-radius:18px;background:linear-gradient(135deg,#073d2e,#138353);color:#fff}.poster-preview img{width:100%;height:100%;object-fit:cover}.poster-preview i{font-size:36px}.poster-preview span{font-size:12px;font-weight:700}@media(max-width:720px){.poster-manager-form{grid-template-columns:1fr}.poster-preview{min-height:165px}}
/* Full 16:6 grocery poster carousel */
.grocery-poster-carousel{position:relative;margin:18px 0;overflow:hidden;border-radius:24px;background:#073d2e;box-shadow:0 14px 30px rgba(8,55,41,.12)}.grocery-poster-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.grocery-poster-track::-webkit-scrollbar{display:none}.grocery-poster-slide{position:relative;display:flex;align-items:center;flex:0 0 100%;aspect-ratio:16/6;min-height:210px;overflow:hidden;background:linear-gradient(120deg,#063e2f,#096347);scroll-snap-align:start;color:#fff}.grocery-poster-slide>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.grocery-poster-slide:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,41,30,.82),rgba(3,41,30,.28) 52%,rgba(3,41,30,.05))}.grocery-poster-copy{position:relative;z-index:1;max-width:58%;padding:clamp(18px,3vw,38px)}.grocery-poster-copy span{display:inline-block;padding:6px 9px;border-radius:8px;background:#19a653;font-size:10px;font-weight:850;text-transform:uppercase}.grocery-poster-copy h2{margin:12px 0 7px;color:#fff;font-size:clamp(24px,3.2vw,43px);line-height:1.05}.grocery-poster-copy p{margin:0 0 14px;color:#d8eee3}.grocery-poster-copy a{display:inline-flex;align-items:center;gap:9px;padding:10px 14px;border-radius:11px;background:#fff;color:#09432f;font-size:13px;font-weight:850}.grocery-poster-dots{position:absolute;z-index:2;right:16px;bottom:14px;display:flex;gap:6px}.grocery-poster-dots button{width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.45)}.grocery-poster-dots button.active{width:21px;border-radius:10px;background:#fff}@media(max-width:620px){.grocery-poster-carousel{margin:14px 0;border-radius:18px}.grocery-poster-slide{min-height:150px}.grocery-poster-copy{max-width:70%;padding:17px}.grocery-poster-copy h2{font-size:22px}.grocery-poster-copy p{display:none}.grocery-poster-copy a{padding:8px 11px;font-size:11px}}
/* User store overview */
.grocery-app-head{position:relative}.grocery-stores-link{display:flex;align-items:center;gap:6px;align-self:start;padding:10px 12px;border:1px solid rgba(255,255,255,.24);border-radius:13px;color:#fff;text-decoration:none;font-size:12px;font-weight:800}.grocery-stores-link:hover{background:rgba(255,255,255,.12);color:#fff}.store-overview-head{margin-bottom:20px}.store-overview-head h1{margin:5px 0 7px;font-size:clamp(27px,4vw,40px);color:var(--primary)}.store-overview-head p{margin:0;color:var(--muted)}.user-store-overview-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(285px,1fr));gap:17px}.user-store-overview-card{overflow:hidden;border:1px solid #dfe9e4;border-radius:22px;background:#fff;box-shadow:0 12px 32px rgba(8,55,41,.07)}.user-store-cover{position:relative;height:135px;background:linear-gradient(135deg,#073d2e,#16885a)}.user-store-cover>img{width:100%;height:100%;object-fit:cover}.user-store-cover>span{position:absolute;top:12px;right:12px;padding:6px 9px;border-radius:999px;background:#e7f8ee;color:#087a43;font-size:10px;font-weight:850}.user-store-cover>span.closed{background:#fdeaea;color:#b42318}.user-store-overview-body{position:relative;padding:17px}.user-store-logo{position:absolute;top:-29px;left:17px;display:grid;width:58px;height:58px;place-items:center;overflow:hidden;border:4px solid #fff;border-radius:17px;background:#eaf4ee;color:var(--primary);font-size:24px;box-shadow:0 6px 15px rgba(8,55,41,.12)}.user-store-logo img{width:100%;height:100%;object-fit:cover}.user-store-overview-body h2{margin:17px 0 5px;font-size:20px}.store-address{min-height:32px;margin:0;color:var(--muted);font-size:12px}.store-overview-stats{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.store-overview-stats span{padding:6px 8px;border-radius:9px;background:#f2f7f4;color:#456357;font-size:10px;font-weight:700}.store-overview-stats i{color:#e4a50a}.store-overview-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:12px;border-top:1px solid var(--line);font-size:11px;color:var(--muted)}.store-overview-footer b{color:var(--primary)}@media(max-width:620px){.grocery-stores-link span{display:none}.grocery-stores-link{padding:10px}.user-store-overview-grid{grid-template-columns:1fr}}
/* Store picker and product detail */
.store-picker-sheet[hidden]{display:none}.store-picker-sheet{position:fixed;z-index:10050;inset:0;display:grid;align-items:end}.store-picker-backdrop{position:absolute;inset:0;background:rgba(3,31,23,.5)}.store-picker-sheet>section{position:relative;z-index:1;max-height:82dvh;overflow:auto;padding:22px 18px calc(24px + env(safe-area-inset-bottom));border-radius:25px 25px 0 0;background:#fff;box-shadow:0 -20px 50px rgba(0,0,0,.2)}.store-picker-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}.store-picker-head h2{margin:3px 0 0;font-size:24px}.store-picker-head button{display:grid;width:36px;height:36px;place-items:center;border:0;border-radius:12px;background:#eff5f1;color:var(--primary);font-size:25px}.store-picker-live,.store-picker-list a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;width:100%;padding:13px;border:1px solid #dce8e2;border-radius:16px;background:#f4faf6;color:var(--ink);text-align:left;text-decoration:none}.store-picker-live{margin-bottom:12px}.store-picker-live>i:first-child,.store-picker-icon{display:grid;width:39px;height:39px;place-items:center;border-radius:12px;background:var(--primary);color:#fff}.store-picker-live strong,.store-picker-live small,.store-picker-list strong,.store-picker-list small{display:block}.store-picker-live small,.store-picker-list small{margin-top:2px;color:var(--muted);font-size:11px}.store-picker-list{display:grid;gap:9px}.store-picker-list a{background:#fff}.product-open-link{display:block;color:inherit;text-decoration:none}.product-open-link:hover{color:inherit}.product-detail{max-width:980px;margin:0 auto}.product-back{display:inline-flex;align-items:center;gap:7px;margin-bottom:17px;color:var(--primary);font-weight:800;text-decoration:none}.product-detail-grid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(300px,.9fr);gap:28px;padding:22px;border:1px solid #dce7e1;border-radius:25px;background:#fff;box-shadow:0 15px 38px rgba(8,55,41,.08)}.product-detail-image{display:grid;place-items:center;aspect-ratio:1;border-radius:20px;background:#f0f7f3;color:var(--primary);font-size:60px;overflow:hidden}.product-detail-image img{width:100%;height:100%;object-fit:cover}.product-store-name{display:inline-flex;gap:7px;align-items:center;color:var(--primary);font-size:13px;font-weight:800}.product-detail h1{margin:12px 0 6px;font-size:clamp(28px,4vw,43px);color:var(--ink)}.product-detail h2{margin:18px 0;font-size:29px;color:var(--primary)}.product-detail-unit,.product-detail-description{color:var(--muted)}.product-store-box{display:grid;gap:4px;margin:20px 0;padding:14px;border:1px solid #dbe8e1;border-radius:15px;background:#f7fbf8}.product-store-box span,.product-store-box small{color:var(--muted);font-size:12px}@media(max-width:720px){.product-detail-grid{grid-template-columns:1fr;padding:15px;gap:18px}.product-detail-image{max-height:360px}.store-picker-sheet>section{padding:18px 14px calc(20px + env(safe-area-inset-bottom))}}
.password-field{position:relative}.password-field .form-control{padding-right:68px}.password-field button{position:absolute;top:50%;right:8px;transform:translateY(-50%);border:0;border-radius:8px;background:var(--primary-soft);color:var(--primary);padding:5px 8px;font-size:11px;font-weight:800}