/* Courier Management - application styles (no build step required) */
@font-face { font-family: 'Hind Siliguri'; font-weight: 400; font-display: swap; src: url('../vendor/fonts/hind-siliguri-bengali-400-normal.woff2') format('woff2'); unicode-range: U+0951-0952,U+0964-0965,U+0980-09FE,U+1CD0,U+1CD2,U+1CD5-1CD6,U+1CD8,U+1CE1,U+1CEA,U+1CED,U+1CF2,U+1CF5-1CF7,U+200C-200D,U+20B9,U+25CC,U+A8F1; }
@font-face { font-family: 'Hind Siliguri'; font-weight: 500; font-display: swap; src: url('../vendor/fonts/hind-siliguri-bengali-500-normal.woff2') format('woff2'); unicode-range: U+0951-0952,U+0964-0965,U+0980-09FE,U+200C-200D,U+25CC; }
@font-face { font-family: 'Hind Siliguri'; font-weight: 600; font-display: swap; src: url('../vendor/fonts/hind-siliguri-bengali-600-normal.woff2') format('woff2'); unicode-range: U+0951-0952,U+0964-0965,U+0980-09FE,U+200C-200D,U+25CC; }
@font-face { font-family: 'Hind Siliguri'; font-weight: 700; font-display: swap; src: url('../vendor/fonts/hind-siliguri-bengali-700-normal.woff2') format('woff2'); unicode-range: U+0951-0952,U+0964-0965,U+0980-09FE,U+200C-200D,U+25CC; }
@font-face { font-family: 'Inter'; font-weight: 400; font-display: swap; src: url('../vendor/fonts/inter-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 500; font-display: swap; src: url('../vendor/fonts/inter-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 600; font-display: swap; src: url('../vendor/fonts/inter-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-weight: 700; font-display: swap; src: url('../vendor/fonts/inter-latin-700-normal.woff2') format('woff2'); }

:root {
  --brand: #0f766e;
  --accent: #f59e0b;
  --ink: #0f172a;
  --muted: #64748b;
  --line: #e2e8f0;
  --canvas: #f4f6f8;
  --sidebar: #0b1f1d;
  --bs-body-font-family: 'Inter', 'Hind Siliguri', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bs-body-color: var(--ink);
  --bs-border-color: var(--line);
}
html[lang="bn"] { --bs-body-font-family: 'Hind Siliguri', 'Inter', system-ui, sans-serif; }
html[lang="bn"] body { font-size: 1.02rem; line-height: 1.6; }
body { background: var(--canvas); }
a { color: var(--brand); }
.btn-brand { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-color: #fff; --bs-btn-hover-bg: color-mix(in srgb, var(--brand) 85%, #000); --bs-btn-hover-border-color: color-mix(in srgb, var(--brand) 85%, #000); --bs-btn-hover-color: #fff; --bs-btn-active-bg: color-mix(in srgb, var(--brand) 75%, #000); --bs-btn-disabled-bg: var(--brand); --bs-btn-disabled-border-color: var(--brand); }
.btn-outline-brand { --bs-btn-color: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand); --bs-btn-hover-color: #fff; }
.text-brand { color: var(--brand) !important; }
.bg-brand { background: var(--brand) !important; color: #fff; }
.form-control:focus, .form-select:focus { border-color: var(--brand); box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--brand) 20%, transparent); }

/* App shell */
.app-shell { display: flex; min-height: 100vh; }
.app-sidebar { width: 252px; flex-shrink: 0; background: var(--sidebar); color: #cbd5e1; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.app-sidebar .brand { display: flex; align-items: center; gap: .6rem; padding: 1.1rem 1.2rem; color: #fff; font-weight: 700; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.07); }
.app-sidebar .brand img { height: 30px; }
.app-sidebar .brand .mark { width: 30px; height: 30px; border-radius: 8px; background: var(--brand); display: grid; place-items: center; color: #fff; }
.app-sidebar .nav-section { font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: #64748b; padding: 1rem 1.2rem .35rem; }
.app-sidebar .nav-link { color: #cbd5e1; padding: .42rem 1.2rem; display: flex; gap: .65rem; align-items: center; font-size: .92rem; border-left: 3px solid transparent; }
.app-sidebar .nav-link:hover { color: #fff; background: rgba(255,255,255,.04); }
.app-sidebar .nav-link.active { color: #fff; background: rgba(255,255,255,.07); border-left-color: var(--accent); }
.app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.app-topbar { background: #fff; border-bottom: 1px solid var(--line); padding: .6rem 1.25rem; display: flex; align-items: center; gap: .75rem; position: sticky; top: 0; z-index: 1020; }
.app-content { padding: 1.25rem; flex: 1; }
.page-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1rem; }
.page-head h1 { font-size: 1.35rem; font-weight: 700; margin: 0; }
.card { border-color: var(--line); border-radius: .7rem; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.card-header { background: #fff; font-weight: 600; border-bottom-color: var(--line); }
.stat { padding: 1rem 1.1rem; }
.stat .label { color: var(--muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.stat .value { font-size: 1.55rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.table { --bs-table-bg: transparent; }
.table > :not(caption) > * > * { padding: .6rem .75rem; vertical-align: middle; }
.table thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); font-weight: 600; background: #f8fafc; white-space: nowrap; }
.num { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.status-pill { display: inline-flex; align-items: center; gap: .35rem; padding: .18rem .6rem; border-radius: 999px; font-size: .78rem; font-weight: 600; background: color-mix(in srgb, var(--c) 14%, #fff); color: color-mix(in srgb, var(--c) 80%, #000); white-space: nowrap; }
.status-pill::before { content: ''; width: .45rem; height: .45rem; border-radius: 50%; background: var(--c); }
.timeline { list-style: none; padding: 0; margin: 0; position: relative; }
.timeline li { position: relative; padding: 0 0 1rem 1.6rem; }
.timeline li::before { content: ''; position: absolute; left: .32rem; top: .35rem; bottom: -.35rem; width: 2px; background: var(--line); }
.timeline li:last-child::before { display: none; }
.timeline li .dot { position: absolute; left: 0; top: .2rem; width: .8rem; height: .8rem; border-radius: 50%; background: var(--c, var(--brand)); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--line); }
.filters .form-control, .filters .form-select { min-width: 140px; }
.empty-state { text-align: center; color: var(--muted); padding: 2.5rem 1rem; }
.empty-state i { font-size: 2rem; display: block; margin-bottom: .5rem; }
.required::after { content: ' *'; color: #dc2626; }
.btn[data-loading] .spinner-border { display: none; }
.btn.is-loading .spinner-border { display: inline-block; }
.is-loading { pointer-events: none; opacity: .75; }

/* Public site */
.public-nav { background: #fff; border-bottom: 1px solid var(--line); }
.hero { background: radial-gradient(1200px 400px at 85% -10%, color-mix(in srgb, var(--accent) 22%, transparent), transparent), linear-gradient(135deg, var(--sidebar), color-mix(in srgb, var(--brand) 70%, var(--sidebar))); color: #fff; padding: 4.5rem 0 4rem; }
.hero h1 { font-weight: 800; font-size: clamp(2rem, 4vw, 3.1rem); letter-spacing: -.02em; }
.hero .track-box { background: #fff; border-radius: .9rem; padding: .5rem; box-shadow: 0 20px 40px rgba(0,0,0,.2); }
.feature i { font-size: 1.6rem; color: var(--brand); }
.public-footer { background: var(--sidebar); color: #94a3b8; }
.public-footer a { color: #cbd5e1; text-decoration: none; }

/* Rider (mobile first) */
.rider-body { max-width: 640px; margin: 0 auto; padding-bottom: 5rem; }
.rider-tabbar { position: fixed; bottom: 0; left: 0; right: 0; background: #fff; border-top: 1px solid var(--line); display: flex; z-index: 1030; }
.rider-tabbar a { flex: 1; text-align: center; padding: .55rem 0; color: var(--muted); font-size: .75rem; text-decoration: none; }
.rider-tabbar a.active { color: var(--brand); font-weight: 600; }
.rider-tabbar i { display: block; font-size: 1.25rem; }
.task-card { border-left: 4px solid var(--c, var(--brand)); }

/* Labels / print */
.label-sheet { display: flex; flex-wrap: wrap; gap: 8px; }
.ship-label { width: 100mm; min-height: 70mm; border: 1px dashed #333; padding: 4mm; background: #fff; font-size: 11px; page-break-inside: avoid; }
.ship-label .barcode svg { width: 100%; height: 42px; }
@media print {
  .no-print, .app-sidebar, .app-topbar { display: none !important; }
  body, .app-content { background: #fff; padding: 0; }
  .ship-label { border: 1px solid #000; }
}

@media (max-width: 991.98px) {
  .app-sidebar { position: fixed; left: -260px; z-index: 1040; transition: left .2s; }
  .app-sidebar.open { left: 0; }
  .app-content { padding: 1rem; }
}

/* ===== v1.2 merchant experience ===== */
.m-wallet { display: inline-flex; align-items: center; gap: .55rem; border: 0; border-radius: 999px; padding: .25rem .3rem .25rem .3rem; background: linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 60%, #0b1433)); color: #fff; box-shadow: 0 6px 16px color-mix(in srgb, var(--brand) 35%, transparent), inset 0 1px 0 rgba(255,255,255,.25); transition: transform .15s; }
.m-wallet:hover { transform: translateY(-1px); }
.m-wallet.is-due { background: linear-gradient(135deg, #dc2626, #7f1d1d); box-shadow: 0 6px 16px rgba(220,38,38,.35); }
.m-wallet__icon { width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.18); display: grid; place-items: center; }
.m-wallet__txt { display: flex; flex-direction: column; line-height: 1.05; text-align: left; }
.m-wallet__txt small { font-size: .62rem; opacity: .8; text-transform: uppercase; letter-spacing: .04em; }
.m-wallet__txt strong { font-size: .92rem; font-variant-numeric: tabular-nums; }
.m-wallet__plus { width: 26px; height: 26px; border-radius: 50%; background: #fff; color: var(--brand); display: grid; place-items: center; font-weight: 700; }
.m-wallet.is-due .m-wallet__plus { color: #dc2626; }
@media (max-width: 420px) { .m-wallet__txt small { display: none; } .m-wallet__icon { display: none; } }

.m-notice { display: flex; align-items: flex-start; gap: .75rem; padding: .8rem 1rem; border-radius: 14px; margin-bottom: .75rem; border: 1px solid; position: relative; animation: m-drop .35s ease-out; }
.m-notice > i { font-size: 1.15rem; margin-top: .1rem; }
.m-notice__body { flex: 1; font-size: .92rem; } .m-notice__body strong { margin-right: .3rem; }
.m-notice__x button { border: 0; background: none; opacity: .6; padding: .1rem .3rem; } .m-notice__x button:hover { opacity: 1; }
.m-notice--info { background: #eff6ff; border-color: #bfdbfe; color: #1e3a8a; }
.m-notice--success { background: #f0fdf4; border-color: #bbf7d0; color: #14532d; }
.m-notice--warning { background: #fffbeb; border-color: #fde68a; color: #78350f; }
.m-notice--danger { background: #fef2f2; border-color: #fecaca; color: #7f1d1d; }
@keyframes m-drop { from { opacity: 0; transform: translateY(-6px); } }

.m-topup { border: 0; border-radius: 22px; overflow: hidden; }
.m-topup__head { position: relative; padding: 1.4rem 1.4rem 0; background: linear-gradient(160deg, #0b1433, var(--brand)); }
.m-topup__head .btn-close { position: absolute; top: 1rem; right: 1rem; }
.m-topup__card { position: relative; color: #fff; border-radius: 18px; padding: 1.1rem 1.2rem; margin-bottom: -2.2rem; background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 85%, #fff), var(--accent) 45%, color-mix(in srgb, var(--accent) 50%, #000)); box-shadow: 0 18px 40px rgba(0,0,0,.3); transform: perspective(800px) rotateX(8deg); overflow: hidden; }
.m-topup__card small { display: block; opacity: .85; } .m-topup__card strong { display: block; font-size: 1.8rem; font-variant-numeric: tabular-nums; } .m-topup__card span { font-size: .85rem; opacity: .85; }
.m-topup__card i { position: absolute; right: -10px; bottom: -18px; font-size: 6rem; opacity: .15; }
.m-topup .modal-body { padding-top: 3rem; }
.m-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.m-chip { border: 1px solid #d5ddee; background: #f6f8fd; border-radius: 99px; padding: .35rem .8rem; font-weight: 600; font-size: .9rem; }
.m-chip:hover { border-color: var(--brand); color: var(--brand); }
.m-paylogos { display: flex; flex-wrap: wrap; justify-content: center; gap: .35rem; margin-top: .8rem; }
.m-paylogos span { font-size: .72rem; font-weight: 700; color: #64748b; background: #f1f5f9; border-radius: 6px; padding: .2rem .5rem; }

.m-popup { border: 0; border-radius: 22px; overflow: hidden; box-shadow: 0 40px 80px rgba(0,0,0,.35); animation: m-pop .45s cubic-bezier(.2,1.4,.4,1); }
@keyframes m-pop { from { transform: perspective(900px) rotateX(18deg) scale(.9); opacity: 0; } }
.m-popup__img { width: 100%; max-height: 60vh; object-fit: cover; display: block; }
.m-popup__body { padding: 1.4rem; }
.m-popup__x { position: absolute; top: .8rem; right: .8rem; z-index: 2; background-color: rgba(255,255,255,.9); border-radius: 50%; padding: .5rem; }

.m-bottom { position: fixed; left: .6rem; right: .6rem; bottom: .6rem; z-index: 1030; display: grid; grid-template-columns: repeat(5, 1fr); align-items: end; background: rgba(255,255,255,.92); backdrop-filter: blur(12px); border-radius: 20px; box-shadow: 0 10px 30px rgba(11,20,51,.18); padding: .35rem .3rem calc(.35rem + env(safe-area-inset-bottom)); }
.m-bottom a { display: flex; flex-direction: column; align-items: center; gap: .1rem; text-decoration: none; color: #64748b; font-size: .68rem; font-weight: 600; padding: .25rem 0; }
.m-bottom a i { font-size: 1.25rem; } .m-bottom a.on { color: var(--brand); }
.m-bottom__add { margin-top: -1.6rem; } .m-bottom__add i { width: 54px; height: 54px; border-radius: 18px; display: grid; place-items: center; color: #fff; font-size: 1.6rem !important; background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 60%, #000)); box-shadow: 0 10px 20px color-mix(in srgb, var(--accent) 45%, transparent); transform: perspective(300px) rotateX(10deg); }
@media (max-width: 991.98px) { .is-merchant .app-content { padding-bottom: 6.5rem; } }
.app-topbar .m-wallet { margin-right: .2rem; }

/* Flagged (problem) parcels */
.row-flag { box-shadow: inset 4px 0 0 #dc2626; background: #fff5f5 !important; }
.flag-dot { display: inline-flex; align-items: center; gap: .25rem; font-size: .72rem; font-weight: 700; color: #b91c1c; background: #fee2e2; border-radius: 99px; padding: .1rem .5rem; }
.timeline li.is-remark .dot { width: 1.1rem; height: 1.1rem; left: -.15rem; display: grid; place-items: center; font-size: .55rem; color: #fff; }
.timeline li.is-remark > .fw-semibold { color: #475569; }
.tl-public { background: #eff6ff; border-radius: 8px; padding: .25rem .5rem; margin-top: .25rem; display: inline-block; }
.tl-photo { display: inline-flex; align-items: center; gap: .25rem; margin-top: .25rem; }
.chg-table td, .chg-table th { font-size: .82rem; vertical-align: top; }
.chg-old { color: #b91c1c; text-decoration: line-through; } .chg-new { color: #166534; font-weight: 600; }
.kyc-chip { display: inline-flex; align-items: center; gap: .25rem; font-size: .75rem; font-weight: 700; border-radius: 99px; padding: .1rem .55rem; }
.kyc-chip--approved { background: #dcfce7; color: #166534; } .kyc-chip--pending { background: #fef3c7; color: #92400e; } .kyc-chip--not_submitted, .kyc-chip--rejected { background: #fee2e2; color: #991b1b; }
.er-card { border: 1px solid #fde68a; background: #fffbeb; border-radius: 14px; padding: .8rem 1rem; margin-bottom: .6rem; }
.er-card.is-flagged { border-color: #fca5a5; background: #fef2f2; }
.lock-banner { display: flex; gap: .6rem; align-items: center; background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 12px; padding: .6rem .9rem; font-size: .9rem; margin-bottom: 1rem; }
.r-photo { position: relative; display: grid; place-items: center; height: 150px; border: 2px dashed #94a3b8; border-radius: 16px; background: #f8fafc center/cover no-repeat; cursor: pointer; overflow: hidden; margin: 0; }
.r-photo.is-required { border-color: var(--brand); }
.r-photo input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.r-photo span { display: flex; flex-direction: column; align-items: center; gap: .3rem; font-weight: 700; color: #475569; background: rgba(255,255,255,.85); padding: .5rem .9rem; border-radius: 12px; pointer-events: none; }
.r-photo span i { font-size: 1.8rem; color: var(--brand); }
.r-photo.has-img { border-style: solid; border-color: #16a34a; } .r-photo.has-img span { font-size: .8rem; }

/* ---- Parcel filters & lists (v1.2) ---- */
.pf-tabs { display: flex; gap: .4rem; overflow-x: auto; padding-bottom: .4rem; margin-bottom: .6rem; scrollbar-width: thin; }
.pf-tab { flex: none; display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .85rem; border-radius: 99px; background: #fff; border: 1px solid #e2e8f0; color: #475569; font-weight: 600; font-size: .88rem; text-decoration: none; }
.pf-tab span { background: #f1f5f9; border-radius: 99px; padding: 0 .45rem; font-size: .78rem; }
.pf-tab.on { background: var(--brand); border-color: var(--brand); color: #fff; } .pf-tab.on span { background: rgba(255,255,255,.2); }
.pf-tab.is-red { color: #b91c1c; border-color: #fecaca; } .pf-tab.is-red span { background: #fee2e2; } .pf-tab.is-red.on { background: #dc2626; color: #fff; }
.pf { background: #fff; border: 1px solid #e6ebf5; border-radius: 16px; padding: .7rem; margin-bottom: .6rem; }
.pf-bar { display: flex; gap: .5rem; }
.pf-search { flex: 1; position: relative; } .pf-search i { position: absolute; left: .8rem; top: 50%; transform: translateY(-50%); color: #94a3b8; }
.pf-search input { width: 100%; border: 1px solid #d5ddee; border-radius: 12px; padding: .5rem .8rem .5rem 2.2rem; background: #f8faff; }
.pf-search input:focus { outline: none; border-color: var(--brand); background: #fff; }
.pf-adv { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .4rem 1.2rem; padding: .9rem .3rem .2rem; border-top: 1px dashed #e2e8f0; margin-top: .7rem; }
.pf-col label:not(.pf-check) { display: block; font-size: .74rem; font-weight: 700; color: #64748b; text-transform: uppercase; letter-spacing: .03em; margin: .55rem 0 .2rem; }
.pf-checks { max-height: 240px; overflow-y: auto; border: 1px solid #e2e8f0; border-radius: 10px; padding: .3rem .5rem; }
.pf-check { display: flex; align-items: center; gap: .4rem; font-size: .85rem; padding: .15rem 0; cursor: pointer; }
.pf-check span { width: 10px; height: 10px; border-radius: 50%; background: var(--c); flex: none; }
.pf-quick { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .3rem; } .pf-quick a { font-size: .75rem; background: #f1f5f9; border-radius: 99px; padding: .1rem .5rem; text-decoration: none; color: #475569; }
.pf-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; align-items: center; gap: .5rem; flex-wrap: wrap; border-top: 1px solid #f1f5f9; padding-top: .6rem; margin-top: .4rem; }
.pf-chips { display: flex; flex-wrap: wrap; gap: .3rem; margin-bottom: .6rem; }
.pf-chip { font-size: .78rem; background: color-mix(in srgb, var(--brand) 9%, #fff); color: var(--brand); border: 1px solid color-mix(in srgb, var(--brand) 25%, #fff); border-radius: 99px; padding: .15rem .6rem; text-decoration: none; }
.pl-table td { vertical-align: middle; }
.bulk-bar { position: sticky; bottom: .8rem; z-index: 20; display: none; align-items: center; gap: .5rem; flex-wrap: wrap; background: #0b1433; color: #fff; border-radius: 16px; padding: .6rem .8rem; box-shadow: 0 14px 30px rgba(11,20,51,.3); margin-top: .8rem; }
.bulk-bar.show { display: flex; } .bulk-bar .form-select { width: auto; max-width: 220px; }
@media (max-width: 767.98px) {
  .pf-bar { flex-wrap: wrap; } .pf-search { flex-basis: 100%; } .pf-bar .btn { flex: 1; }
  .pl-table thead { display: none; }
  .pl-table, .pl-table tbody, .pl-table tr, .pl-table td { display: block; width: 100%; }
  .pl-table tr { position: relative; border-bottom: 1px solid #e6ebf5; padding: .7rem .8rem .7rem 2.4rem; }
  .pl-table td { border: 0; padding: .05rem 0; text-align: left !important; }
  .pl-table td:first-child { position: absolute; left: .8rem; top: .9rem; width: auto; }
  .pl-table td[data-l]::before { content: attr(data-l) ': '; color: #94a3b8; font-size: .78rem; }
}
.sms-box { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; padding: .6rem; }
.np-preview { border-radius: 18px; overflow: hidden; border: 1px solid #e2e8f0; background: #fff; box-shadow: 0 20px 40px rgba(11,20,51,.12); max-width: 360px; }
.np-preview img { width: 100%; display: block; max-height: 220px; object-fit: cover; }
.m-wallet__txt strong { white-space: nowrap; } .a-field input[type=password] { padding-right: 2.6rem; }