/* Self-hosted fonts: Bengali text must not depend on a device font or Google Fonts. */
@font-face {
  font-family: "Noto Sans Bengali";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("assets/fonts/noto-sans-bengali-bengali-wght-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: "Noto Sans Bengali";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("assets/fonts/noto-sans-bengali-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
  --app-font: "Noto Sans Bengali", "Hind Siliguri", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ink: #17213a;
  --muted: #76819c;
  --line: #e8eaf2;
  --canvas: #f7f8fc;
  --paper: #ffffff;
  --brand: #0b7bea;
  --brand-dark: #075db5;
  --brand-soft: #eaf4ff;
  --navy: #101c40;
  --navy-2: #172b60;
  --green: #138c5a;
  --green-soft: #e5f7ed;
  --red: #dc4d5b;
  --red-soft: #ffe8ea;
  --orange: #e68a1e;
  --orange-soft: #fff3de;
  --shadow: 0 10px 30px rgba(30, 42, 80, .06);
  --radius: 16px;
  --radius-sm: 11px;
  font-family: var(--app-font);
}

* { box-sizing: border-box; }
html { min-width: 320px; background: var(--canvas); }
body { margin: 0; color: var(--ink); background: var(--canvas); font-size: 14px; line-height: 1.45; }
button, input, select { font: inherit; }
button { cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline: 3px solid rgba(91,43,216,.25); outline-offset: 2px; }
button, input, select { -webkit-tap-highlight-color: transparent; }
button:disabled { cursor: not-allowed; opacity: .55; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.app-shell { min-height: 100vh; padding-left: 255px; }
.sidebar { width: 255px; position: fixed; inset: 0 auto 0 0; z-index: 30; padding: 20px 14px 16px; display: flex; flex-direction: column; color: rgba(255,255,255,.9); background: radial-gradient(circle at 10% 0%, #294987 0, transparent 29%), linear-gradient(158deg, var(--navy) 4%, #152957 65%, #111c41 100%); overflow-y: auto; }
.brand { display: flex; align-items: center; gap: 10px; padding: 4px 9px 22px; color: #fff; text-decoration: none; }
.brand-mark { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(135deg, #7b51f4, #4d24bd); box-shadow: 0 7px 18px rgba(0,0,0,.22); }
.brand-mark svg { width: 29px; height: 29px; }
.brand strong { display: block; font-size: 18px; letter-spacing: -.3px; }
.brand small { display: block; margin-top: -2px; color: #b7c5e9; font-size: 10px; }
.account-card { display: flex; align-items: center; gap: 9px; padding: 11px; margin: 0 3px 19px; border: 1px solid rgba(255,255,255,.1); border-radius: 13px; background: rgba(255,255,255,.07); }
.avatar { display: inline-grid; flex: 0 0 auto; width: 33px; height: 33px; place-items: center; border-radius: 50%; color: #fff; font-size: 10px; font-weight: 800; background: linear-gradient(135deg, #ffb66e, #da6377); }
.avatar--owner { background: linear-gradient(135deg, #8e6ff7, #5032c9); }
.account-card strong, .account-card span { display:block; }
.account-card strong { font-size: 12px; }
.account-card span { color: #b8c4e0; font-size: 10px; }
.nav-menu { display: flex; flex-direction: column; gap: 3px; }
.nav-label { margin: 4px 10px 7px; color: #8798be; font-size: 10px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; }
.nav-label--bottom { margin-top: 17px; }
.nav-item, .support-link { width: 100%; border: 0; display: flex; align-items: center; gap: 11px; min-height: 39px; padding: 8px 10px; border-radius: 10px; color: #bdc8e1; text-align: left; font-size: 13px; background: transparent; transition: .2s ease; }
.nav-item:hover, .nav-item.active, .support-link:hover { color: #fff; background: rgba(120, 155, 245, .18); }
.nav-item.active { box-shadow: inset 2px 0 0 #9f84ff; }
.nav-item i, .support-link i { width: 17px; height: 17px; flex: 0 0 17px; }
.nav-item b { min-width: 18px; height: 18px; padding: 1px 5px; margin-left: auto; display: grid; place-items:center; border-radius: 20px; color: #fff; font-size: 10px; background: rgba(255,255,255,.15); }
.nav-item b.badge-alert { background: #e95775; }
.sidebar-bottom { margin-top: auto; padding: 16px 3px 0; }
.sidebar-bottom span { display: block; padding: 13px 11px 0; color: #8697bc; font-size: 10px; }

.main-content { min-width: 0; }
.topbar { height: 78px; position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; padding: 0 36px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.9); backdrop-filter: blur(14px); }
.topbar-start, .topbar-end, .breadcrumb, .profile-button { display: flex; align-items: center; }
.topbar-start { min-width: 0; }
.breadcrumb { gap: 7px; color: var(--muted); font-size: 12px; }.breadcrumb strong { color: var(--ink); font-weight: 700; }.breadcrumb i, .profile-button > i { width: 13px; height: 13px; }
.topbar-end { gap: 13px; }
.role-select select { appearance: none; min-width: 125px; padding: 8px 28px 8px 11px; border: 1px solid var(--line); border-radius: 8px; color: #39435d; font-size: 11px; font-weight: 700; outline: 0; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%235b2bd8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E") right 8px center / 14px no-repeat; }
.icon-button { width: 36px; height: 36px; position: relative; display:grid; place-items:center; border: 1px solid transparent; border-radius: 9px; color: #536079; background: transparent; }.icon-button:hover { border-color: var(--line); background: var(--canvas); }.icon-button i { width: 18px; height: 18px; }.notification-button span { position: absolute; top: 8px; right: 8px; width: 6px; height: 6px; border: 1.5px solid #fff; border-radius: 50%; background: #e95775; }
.profile-button { gap: 8px; padding: 3px 0 3px 3px; border: 0; color: var(--ink); background: transparent; text-align:left; }.profile-meta strong, .profile-meta small { display: block; }.profile-meta strong { font-size: 11px; }.profile-meta small { color: var(--muted); font-size: 9px; }.profile-button > i { color: var(--muted); margin-left: 1px; }
.mobile-menu { display: none; }

.page { display: none; max-width: 1560px; margin: 0 auto; padding: 30px 36px 45px; animation: page-in .25s ease; }
.page.active { display: block; }
@keyframes page-in { from { opacity: .35; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.page-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 23px; }
.page-heading h1 { margin: 2px 0 2px; font-size: clamp(23px, 2.1vw, 29px); letter-spacing: -.7px; line-height: 1.25; }.page-heading h1 span { font-size: 23px; }.page-heading p { margin: 0; color: var(--muted); font-size: 12px; }.eyebrow { color: var(--brand)!important; font-size: 11px!important; font-weight: 750; }
.heading-actions { display: flex; gap: 9px; }
.button { min-height: 39px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 8px 13px; border: 1px solid var(--brand); border-radius: 9px; color: #fff; background: linear-gradient(135deg, #6a3de4, #4d20c9); box-shadow: 0 5px 13px rgba(84,40,194,.15); font-size: 12px; font-weight: 700; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }.button:hover { transform: translateY(-1px); box-shadow: 0 7px 17px rgba(84,40,194,.23); }.button i { width: 16px; height:16px; }.button--secondary { border-color: #ded8fa; color: var(--brand); box-shadow: none; background: #fff; }.button--secondary:hover { background: var(--brand-soft); }.button--ghost { border-color: transparent; color: var(--muted); background: transparent; box-shadow: none; }.button--full { width: 100%; }
.panel { border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: var(--shadow); }.panel-heading { min-height: 47px; display:flex; align-items:flex-start; justify-content:space-between; gap: 12px; padding: 20px 21px 10px; }.panel-heading h2, .simple-modal h2 { margin:0; font-size: 15px; letter-spacing: -.15px; }.panel-heading p { margin: 2px 0 0; color: var(--muted); font-size: 11px; }.text-button { display: inline-flex; align-items: center; gap: 4px; padding: 3px 0; border:0; color: var(--brand); font-size: 11px; font-weight: 700; background:transparent; }.text-button:hover { color: var(--brand-dark); }.text-button i { width: 13px; height: 13px; }

.stats-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 15px; }.stat-card { min-height: 132px; position: relative; overflow: hidden; padding: 16px; border:1px solid var(--line); border-radius: var(--radius); background:var(--paper); box-shadow: var(--shadow); }.stat-card::after { content:""; position:absolute; width:75px; height:75px; right:-30px; bottom:-32px; border-radius:50%; background:var(--accent-soft); }.stat-card-head { display:flex; align-items:center; justify-content:space-between; }.stat-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:var(--accent); background:var(--accent-soft); }.stat-icon i { width:18px; height:18px; }.stat-card .percent { color:var(--green); font-size:10px; font-weight:800; }.stat-card small { display:block; margin-top:12px; color:var(--muted); font-size:11px; }.stat-card strong { display:block; margin-top:1px; font-size:21px; letter-spacing: -.5px; }.stat-card .delta { position:relative; z-index:1; margin-top:2px; color:var(--muted); font-size:10px; }.stat-card .delta b { color:var(--green); }
.dashboard-grid { display:grid; grid-template-columns: minmax(0, 1.6fr) minmax(320px, .9fr); gap:15px; margin-bottom:15px; }.sales-chart-panel { min-height: 335px; }.chart-legend { display:flex; align-items:center; justify-content:space-between; padding: 4px 22px 0; color:var(--muted); font-size:10px; }.chart-legend span { display:flex; gap:5px; align-items:center; }.chart-legend i { width:8px; height:8px; border-radius:50%; background:var(--brand); }.chart-legend strong { color:var(--brand); font-size:13px; }.chart-wrap { height:235px; padding: 0 12px 8px; }.sales-chart { width:100%; height:100%; }.chart-lines path { stroke:#eef0f6; stroke-width:1; stroke-dasharray: 3 4; }.chart-area { fill:url(#areaFill); }.chart-line { fill:none; stroke:#6840e0; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }.chart-dots circle { fill:#fff; stroke:#6840e0; stroke-width:2.5; }.chart-dots circle:last-child { fill:#6840e0; stroke:#fff; stroke-width:3; }.chart-labels text { fill:#9da6bb; font-size:10px; text-anchor:middle; }
.company-list { list-style:none; padding: 0 16px 11px; margin: 0; }.company-list li { display:grid; grid-template-columns: 18px 28px minmax(0, 1fr) auto; align-items:center; gap:8px; padding: 12px 4px; border-bottom:1px solid #eff0f5; }.company-list li:last-child { border:0; }.rank { color:var(--muted); font-size:11px; }.company-logo { width:28px; height:28px; display:grid; place-items:center; border-radius:9px; color:#fff; font-size:9px; font-weight:800; }.logo-a { background:#ea6f59; }.logo-b { background:#26a379; }.logo-c { background:#576ed3; }.logo-d { background:#d58b30; }.company-list strong, .company-list small { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.company-list strong { font-size:11px; }.company-list small { color:var(--muted); font-size:9px; }.company-list b { font-size:11px; }
.recent-panel { overflow:hidden; }.filter-row { display:flex; align-items:center; gap:6px; }.chip { border:1px solid var(--line); padding:5px 8px; border-radius:7px; color:var(--muted); background:#fff; font-size:10px; }.chip.active, .chip:hover { color:var(--brand); border-color:#d8cdfc; background:var(--brand-soft); }.table-scroll { width:100%; overflow-x:auto; }.table-scroll table { width:100%; min-width:740px; border-collapse:collapse; }.table-scroll th { padding: 10px 21px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:#8b94a9; text-align:left; font-size:10px; font-weight:700; white-space:nowrap; background:#fbfcff; }.table-scroll td { padding: 12px 21px; border-bottom:1px solid #eff0f5; color:#35405a; font-size:11px; white-space:nowrap; }.table-scroll tbody tr:last-child td { border-bottom:0; }.table-scroll tbody tr:hover { background:#fcfbff; }.table-scroll td strong { color:var(--ink); font-size:11px; }.table-scroll td small { display:block; color:var(--muted); font-size:9px; }.status { display:inline-flex; align-items:center; padding:3px 7px; border-radius:5px; font-size:9px; font-weight:800; }.status--success { color:var(--green); background:var(--green-soft); }.status--due { color:#c87b13; background:var(--orange-soft); }.status--danger { color:var(--red); background:var(--red-soft); }

.toolbar { display:flex; justify-content:space-between; gap:12px; margin-bottom:17px; }.search-box { height:40px; max-width:340px; flex:1; display:flex; align-items:center; gap:8px; padding:0 11px; border:1px solid var(--line); border-radius:9px; background:#fff; }.search-box:focus-within { border-color:#b8a5f6; box-shadow:0 0 0 3px #f1edff; }.search-box i { width:17px; height:17px; color:#8e97ab; }.search-box input { width:100%; min-width:0; border:0; outline:0; color:var(--ink); background:transparent; font-size:12px; }.search-box input::placeholder { color:#a1a9ba; }.filter-button { display:flex; align-items:center; gap:6px; border:1px solid var(--line); border-radius:8px; padding:0 12px; color:#536079; background:#fff; font-size:11px; font-weight:700; }.filter-button i { width:14px; height:14px; }
.owner-grid { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:15px; }.owner-card { padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }.owner-card-top { display:flex; align-items:center; gap:10px; }.owner-card .company-logo { width:42px; height:42px; border-radius:13px; font-size:12px; }.owner-card h2 { margin:0; font-size:14px; }.owner-card p { margin:2px 0 0; color:var(--muted); font-size:10px; }.owner-contact { display:flex; justify-content:space-between; gap:8px; padding:13px 0; margin:14px 0 12px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.owner-contact div small,.owner-contact div strong { display:block; }.owner-contact small { color:var(--muted); font-size:9px; }.owner-contact strong { margin-top:2px; font-size:11px; }.owner-card-bottom { display:flex; align-items:center; justify-content:space-between; }.owner-card-bottom .status { margin:0; }

.trip-layout { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(280px,.7fr); gap:15px; }.trip-table { overflow:hidden; }.trip-table-header { display:flex; justify-content:space-between; align-items:center; padding:20px; }.trip-table-header h2 { margin:0; font-size:15px; }.trip-table-header span { color:var(--muted); font-size:11px; }.trip-row { display:grid; grid-template-columns: 58px minmax(155px, 1.2fr) minmax(100px, 1fr) 80px 70px 88px; align-items:center; gap:12px; padding:14px 20px; border-top:1px solid var(--line); }.trip-time { font-size:12px; font-weight:800; }.trip-time small, .trip-route small { display:block; color:var(--muted); font-size:9px; font-weight:500; }.trip-route strong { font-size:12px; }.trip-route p { margin:1px 0 0; color:var(--muted); font-size:10px; }.seat-availability { font-size:11px; }.seat-availability strong { color:var(--green); }.trip-row .text-button { justify-content:flex-end; }.trip-info { padding:17px; text-align:center; }.trip-illustration { height:122px; padding:0 22px; display:flex; align-items:center; justify-content:center; border-radius:13px; background:linear-gradient(155deg, #f1edff, #fafbff); }.trip-illustration svg { max-width:230px; }.trip-info > .status { margin-top:15px; }.trip-info h2 { margin:7px 0 1px; font-size:15px; }.trip-info > p { margin:0; color:var(--muted); font-size:11px; }.trip-info > p i { width:13px; height:13px; vertical-align:middle; }.trip-info-stats { display:grid; grid-template-columns:repeat(2, 1fr); gap:1px; margin:16px 0; border:1px solid var(--line); border-radius:10px; overflow:hidden; background:var(--line); }.trip-info-stats div { padding:10px 5px; background:#fff; }.trip-info-stats small,.trip-info-stats strong { display:block; }.trip-info-stats small { color:var(--muted); font-size:9px; }.trip-info-stats strong { margin-top:2px; font-size:12px; }.positive { color:var(--green)!important; }

.counter-summary { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; margin-bottom:16px; }.counter-summary > div { display:flex; align-items:center; gap:12px; padding:15px; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:var(--shadow); }.counter-summary i { width:38px; height:38px; padding:9px; border-radius:10px; color:var(--brand); background:var(--brand-soft); }.counter-summary div:nth-child(2) i { color:#168d5d; background:var(--green-soft); }.counter-summary div:nth-child(3) i { color:#e18b1e; background:var(--orange-soft); }.counter-summary small,.counter-summary strong { display:block; }.counter-summary small { color:var(--muted); font-size:10px; }.counter-summary strong { margin-top:1px; font-size:17px; }.counter-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }.counter-card { padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }.counter-card-head { display:flex; align-items:flex-start; gap:10px; }.counter-icon { flex:0 0 auto; width:37px; height:37px; padding:9px; border-radius:11px; color:#fff; background:linear-gradient(135deg, #7851ec, #4c23bf); }.counter-icon.color-green{background:linear-gradient(135deg,#32ba8e,#117c55)}.counter-icon.color-orange{background:linear-gradient(135deg,#ffa837,#e27c0b)}.counter-icon.color-red{background:linear-gradient(135deg,#ff7a88,#d74459)}.counter-card h2 { margin:0; font-size:14px; }.counter-card p { margin:2px 0 0; color:var(--muted); font-size:10px; }.counter-card .status { margin-left:auto; }.counter-card-detail { display:flex; align-items:center; gap:14px; margin:15px 0; padding:11px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.counter-card-detail div { flex:1; }.counter-card-detail small,.counter-card-detail strong { display:block; }.counter-card-detail small { color:var(--muted); font-size:9px; }.counter-card-detail strong { margin-top:2px; font-size:13px; }.counter-card-footer { display:flex; align-items:center; justify-content:space-between; }.counter-card-footer span { display:flex; align-items:center; gap:4px; color:var(--muted); font-size:10px; }.counter-card-footer i { width:13px; height:13px; }
.staff-panel { overflow:hidden; }.staff-person { display:flex; align-items:center; gap:8px; }.staff-person .avatar { width:30px; height:30px; font-size:9px; }.more-button { width:26px; height:26px; border:0; border-radius:7px; color:var(--muted); background:transparent; }.more-button:hover { background:var(--brand-soft); color:var(--brand); }.more-button i { width:17px; height:17px; }

.sales-heading { align-items:center; }.sales-progress { position:relative; display:grid; grid-template-columns:25px 25px 25px 25px 25px; grid-template-rows:25px 18px; align-items:center; color:#a7afbd; }.sales-progress span { width:24px; height:24px; z-index:1; display:grid; place-items:center; border:1px solid #d6dbe6; border-radius:50%; color:#8c95aa; background:#fff; font-size:10px; font-weight:800; }.sales-progress span.active { border-color:var(--brand); color:#fff; background:var(--brand); }.sales-progress i { height:1px; background:#d6dbe6; }.sales-progress small { grid-column:1 / 6; color:var(--muted); font-size:9px; text-align:center; white-space:nowrap; }.sales-workspace { display:grid; grid-template-columns:260px minmax(320px, 1fr) 270px; align-items:start; gap:15px; }.sales-left,.sales-center,.sales-right { overflow:hidden; }.trip-search-form,.booking-form { padding:5px 17px 17px; }.trip-search-form label,.booking-form > label,.company-settings label { display:block; margin-bottom:12px; color:#566078; font-size:10px; font-weight:700; }.trip-search-form select,.trip-search-form input,.booking-form input,.booking-form select,.company-settings input { width:100%; height:37px; margin-top:4px; padding:0 10px; border:1px solid #e3e6ef; border-radius:7px; outline:0; color:#263149; background:#fff; font-size:11px; transition:border .15s ease; }.trip-search-form select:focus,.trip-search-form input:focus,.booking-form input:focus,.booking-form select:focus,.company-settings input:focus { border-color:#9678f2; box-shadow:0 0 0 3px #f1edff; }.trip-search-form .button { margin-top:3px; }.trip-results-label { display:flex; justify-content:space-between; padding:14px 17px 9px; border-top:1px solid var(--line); }.trip-results-label strong { font-size:12px; }.trip-results-label span { color:var(--muted); font-size:9px; }.sales-trip-list { padding:0 10px 10px; }.sales-trip-card { width:100%; position:relative; padding:12px 10px; margin:5px 0; border:1px solid transparent; border-radius:10px; color:var(--ink); background:#fff; text-align:left; }.sales-trip-card:hover { background:#fbfaff; }.sales-trip-card.active { border-color:#cdbffa; background:#f7f4ff; }.sales-trip-card.active::before { content:""; position:absolute; left:-11px; top:14px; bottom:14px; width:3px; border-radius:0 3px 3px 0; background:var(--brand); }.sales-trip-card-top { display:flex; align-items:center; justify-content:space-between; }.sales-trip-card strong { font-size:11px; }.sales-trip-card .status { font-size:8px; }.sales-trip-card p { margin:3px 0 0; color:#556078; font-size:10px; }.sales-trip-card-bottom { display:flex; align-items:center; justify-content:space-between; margin-top:7px; }.sales-trip-card-bottom span { color:var(--green); font-size:10px; font-weight:700; }.sales-trip-card-bottom b { color:#4e5870; font-size:10px; }
.sales-center .panel-heading { padding-bottom:10px; }.seat-count { align-self:center; padding:4px 7px; border-radius:6px; color:var(--green); background:var(--green-soft); font-size:9px; font-weight:800; }.seat-legend { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; padding:0 15px 13px; color:var(--muted); font-size:9px; }.seat-legend span { display:flex; align-items:center; gap:4px; }.seat-icon { width:12px; height:12px; border:1px solid #b4bdc7; border-radius:3px; background:#fff; }.seat-icon.available { border-color:#8bd2a8; background:#dcf6e5; }.seat-icon.selected { border-color:#7250e8; background:#6640dd; }.seat-icon.booked { border-color:#ffb0b6; background:#ffdce0; }.seat-icon.blocked { border-color:#d6dbe2; background:#edf0f3; }.bus-seat-wrap { position:relative; max-width:330px; min-height:318px; margin:0 auto 14px; padding:45px 23px 18px; border:2px solid #e5e1f8; border-top:0; border-radius:0 0 25px 25px; background:linear-gradient(135deg,#fcfbff,#f7f5ff); }.bus-front { position:absolute; top:0; left:0; right:0; height:40px; display:flex; align-items:center; justify-content:flex-end; gap:9px; padding:0 17px; border-radius:18px 18px 0 0; color:#836ee0; background:#ece7fe; font-size:9px; font-weight:800; }.bus-front i { width:18px; height:18px; }.seat-grid { display:grid; grid-template-columns:repeat(5, minmax(42px, 1fr)); gap:8px 10px; max-width:300px; margin:0 auto; align-items:center; }.seat-aisle { width:100%; min-width:18px; height:29px; }.seat-button { height:29px; position:relative; border:1px solid #8bd2a8; border-radius:6px; color:#208651; background:#dcf6e5; font-size:10px; font-weight:800; transition:.15s ease; }.seat-button:hover:not(.booked):not(.blocked) { transform:translateY(-1px); box-shadow:0 4px 8px rgba(44,126,76,.15); }.seat-button.selected { border-color:#5630c8; color:#fff; background:#643bd8; }.seat-button.booked { border-color:#ffbac1; color:#d44d5c; background:#ffe1e4; cursor:not-allowed; }.seat-button.blocked { border-color:#dde1e5; color:#8992a0; background:#edf0f2; cursor:not-allowed; }.selected-seat-summary { display:grid; grid-template-columns:1.2fr .8fr .9fr; gap:1px; margin:0 16px 16px; overflow:hidden; border:1px solid var(--line); border-radius:10px; background:var(--line); }.selected-seat-summary div { padding:10px 8px; background:#fff; }.selected-seat-summary small,.selected-seat-summary strong { display:block; }.selected-seat-summary small { color:var(--muted); font-size:9px; }.selected-seat-summary strong { margin-top:2px; color:var(--brand-dark); font-size:11px; }.input-pair { display:grid; grid-template-columns:1fr .65fr; gap:8px; }.input-pair label { display:block; margin-bottom:12px; color:#566078; font-size:10px; font-weight:700; }.payment-note { display:flex; gap:7px; padding:8px; margin:0 0 12px; border:1px solid #eee8ff; border-radius:8px; color:#6c6291; background:#faf8ff; font-size:9px; }.payment-note i { width:15px; height:15px; flex:0 0 15px; color:var(--brand); }

.audit-filters { display:grid; grid-template-columns:minmax(220px,1fr) 160px 140px auto; align-items:end; gap:10px; padding:14px; margin-bottom:15px; }.audit-filters .search-box { max-width:none; }.audit-filters label { color:var(--muted); font-size:9px; font-weight:700; }.audit-filters input,.audit-filters select { width:100%; height:39px; display:block; margin-top:4px; padding:0 8px; border:1px solid var(--line); border-radius:8px; color:#35405a; background:#fff; font-size:11px; }.audit-filters .button { min-width:73px; }.audit-panel { overflow:hidden; }
.report-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; margin-bottom:15px; }.report-card { position:relative; overflow:hidden; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }.report-card > i { position:absolute; top:17px; right:17px; width:35px; height:35px; padding:9px; border-radius:10px; color:var(--brand); background:var(--brand-soft); }.report-card:nth-child(2)>i { color:var(--green); background:var(--green-soft); }.report-card:nth-child(3)>i { color:var(--orange); background:var(--orange-soft); }.report-card small,.report-card strong,.report-card span { display:block; }.report-card small { color:var(--muted); font-size:10px; }.report-card strong { margin:5px 0; font-size:23px; }.trend { font-size:10px; font-weight:700; }.trend.up { color:var(--green); }.trend.neutral { color:var(--muted); }.report-grid { display:grid; grid-template-columns: minmax(0,1.5fr) minmax(280px,.7fr); gap:15px; }.report-chart { min-height:315px; }.bar-chart { height:218px; display:grid; grid-template-columns:repeat(7,1fr); align-items:end; gap:15px; padding:12px 28px 28px; }.bar-chart div { height:100%; position:relative; display:flex; align-items:flex-end; justify-content:center; border-bottom:1px solid #e9eaf1; }.bar-chart span { width:min(42px,68%); border-radius:7px 7px 2px 2px; background:linear-gradient(180deg,#8b68ec,#4e25c7); }.bar-chart div:nth-child(2) span,.bar-chart div:nth-child(5) span { background:linear-gradient(180deg,#b99eff,#714be2); }.bar-chart small { position:absolute; bottom:-22px; width:max-content; color:var(--muted); font-size:9px; }.commission-card { padding-bottom:15px; }.commission-ring { width:145px; height:145px; display:grid; place-items:center; margin:10px auto 15px; border-radius:50%; background:conic-gradient(var(--brand) 0 72%, #e9e4fc 72% 100%); }.commission-ring::before { content:""; position:absolute; width:117px; height:117px; border-radius:50%; background:#fff; }.commission-ring span { position:relative; z-index:1; text-align:center; }.commission-ring strong,.commission-ring small { display:block; }.commission-ring strong { font-size:16px; }.commission-ring small { color:var(--muted); font-size:9px; }.commission-card dl { margin:0; padding:0 21px; }.commission-card dl div { display:flex; justify-content:space-between; padding:7px 0; border-top:1px solid var(--line); }.commission-card dt { color:var(--muted); font-size:10px; }.commission-card dd { margin:0; font-size:11px; font-weight:800; }.warning { color:#dc8c19!important; }

.utility-page { max-width:1200px; }.notification-list { overflow:hidden; }.notification-list article { position:relative; display:flex; gap:12px; align-items:flex-start; padding:17px 20px; border-bottom:1px solid var(--line); }.notification-list article:last-child { border:0; }.notification-list article > i { flex:0 0 auto; width:33px; height:33px; padding:8px; border-radius:10px; color:var(--brand); background:var(--brand-soft); }.notification-list article:nth-child(2)>i { color:var(--orange); background:var(--orange-soft); }.notification-list strong { display:block; font-size:12px; }.notification-list p { margin:2px 0; color:var(--muted); font-size:11px; }.notification-list small { color:#9da5b5; font-size:9px; }.notification-list article > span { width:7px; height:7px; margin-left:auto; border-radius:50%; background:#7450e6; }.settings-grid,.support-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }.settings-grid .panel { padding:21px; }.settings-grid h2 { margin:0 0 12px; font-size:15px; }.setting-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 0; border-top:1px solid var(--line); }.setting-row strong,.setting-row small { display:block; }.setting-row strong { font-size:11px; }.setting-row small { margin-top:1px; color:var(--muted); font-size:9px; }.setting-row input { width:37px; height:21px; appearance:none; border-radius:20px; background:#d9dfea; transition:.2s; }.setting-row input::after { content:""; display:block; width:17px; height:17px; margin:2px; border-radius:50%; background:#fff; box-shadow:0 1px 3px #95a0b6; transition:.2s; }.setting-row input:checked { background:var(--brand); }.setting-row input:checked::after { transform:translateX(16px); }.company-settings .button { margin-top:4px; }.support-grid { grid-template-columns:repeat(3,1fr); }.support-card { padding:22px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:var(--shadow); }.support-card > i { width:39px; height:39px; padding:10px; border-radius:12px; color:var(--brand); background:var(--brand-soft); }.support-card:nth-child(2)>i{ color:var(--green); background:var(--green-soft); }.support-card:nth-child(3)>i{ color:var(--orange); background:var(--orange-soft); }.support-card h2 { margin:13px 0 4px; font-size:14px; }.support-card p { min-height:36px; margin:0 0 10px; color:var(--muted); font-size:11px; }

.backdrop { display:none; }.bottom-nav { display:none; }.modal { visibility:hidden; opacity:0; position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:18px; background:rgba(11,18,42,.5); transition:opacity .2s,visibility .2s; }.modal.open { visibility:visible; opacity:1; }.modal-card { width:min(100%,490px); position:relative; max-height:calc(100vh - 36px); overflow:auto; border-radius:19px; background:#fff; box-shadow:0 20px 60px rgba(10,16,38,.27); transform:translateY(8px) scale(.98); transition:transform .2s; }.modal.open .modal-card { transform:none; }.modal-close { width:32px; height:32px; position:absolute; top:12px; right:12px; z-index:2; display:grid; place-items:center; border:0; border-radius:8px; color:var(--muted); background:#f3f4f8; }.modal-close:hover { color:var(--red); background:var(--red-soft); }.modal-close i { width:16px; height:16px; }.ticket-success { padding:24px 55px 14px; text-align:center; }.ticket-success > span { width:48px; height:48px; display:grid; place-items:center; margin:0 auto 8px; border-radius:50%; color:var(--green); background:var(--green-soft); }.ticket-success i { width:25px; height:25px; }.ticket-success p { margin:0; color:var(--green); font-size:13px; font-weight:800; }.ticket-preview { padding:0 25px; }.issued-ticket { overflow:hidden; border:1px dashed #a797e4; border-radius:12px; }.issued-ticket-header { padding:14px 16px; color:#fff; background:linear-gradient(135deg,#7548e2,#4420ab); text-align:center; }.issued-ticket-header .mini-brand { display:flex; align-items:center; justify-content:center; gap:5px; font-size:11px; font-weight:800; }.issued-ticket-header p { margin:3px 0 0; color:#e4dcff; font-size:9px; }.issued-route { display:flex; align-items:center; justify-content:center; gap:10px; padding:13px; border-bottom:1px dashed #d6cfff; font-size:13px; font-weight:800; }.issued-route i { width:16px; height:16px; color:var(--brand); }.issued-details { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; padding:15px 16px; }.issued-details div:nth-child(odd):last-child { grid-column:1 / -1; }.issued-details small,.issued-details strong { display:block; }.issued-details small { color:var(--muted); font-size:9px; }.issued-details strong { margin-top:1px; font-size:11px; }.issued-ticket-footer { display:flex; align-items:center; justify-content:space-between; padding:11px 16px; border-top:1px dashed #d6cfff; color:var(--muted); font-size:9px; }.ticket-code { color:var(--brand); font-size:10px; font-weight:800; }.ticket-actions { display:flex; gap:7px; padding:17px 25px 25px; }.ticket-actions .button { flex:1; padding-left:6px; padding-right:6px; }.simple-modal { padding:27px; }.simple-modal h2 { padding-right:28px; }.simple-modal p { color:var(--muted); font-size:12px; }.simple-modal form { margin-top:17px; }.simple-modal label { display:block; margin-bottom:12px; color:#566078; font-size:10px; font-weight:700; }.simple-modal input { width:100%; height:40px; margin-top:4px; padding:0 10px; border:1px solid var(--line); border-radius:8px; outline:0; }.simple-modal .button { margin-top:4px; }.toast { visibility:hidden; opacity:0; position:fixed; z-index:200; bottom:24px; left:50%; max-width:calc(100vw - 32px); padding:11px 14px; border-radius:9px; color:#fff; background:#253255; box-shadow:0 10px 25px rgba(15,26,58,.22); font-size:12px; font-weight:700; transform:translate(-50%,14px); transition:.2s; }.toast.show { visibility:visible; opacity:1; transform:translate(-50%,0); }


/* Counter Staff — named bus access selector */
.staff-bus-access{margin:4px 0 2px;padding:14px;border:1px solid #dfe4f1;border-radius:14px;background:#fbfcff}
.staff-bus-access legend{padding:0 6px;color:var(--ink);font-size:12px;font-weight:800}
.staff-bus-access>p{margin:2px 0 11px;color:var(--muted);font-size:10px}
.staff-bus-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:250px;overflow:auto;padding-right:2px}
.staff-bus-option{display:flex;align-items:flex-start;gap:9px;padding:10px;border:1px solid var(--line);border-radius:11px;background:#fff;cursor:pointer;transition:.18s ease}
.staff-bus-option:hover{border-color:#cfc5f8;background:var(--brand-soft)}
.staff-bus-option:has(input:checked){border-color:#bcaef2;background:#f5f1ff;box-shadow:inset 0 0 0 1px #ddd4fb}
.staff-bus-option input{margin-top:3px;accent-color:var(--brand)}
.staff-bus-option span{min-width:0}.staff-bus-option strong,.staff-bus-option small{display:block}.staff-bus-option strong{font-size:11px}.staff-bus-option small{margin-top:2px;color:var(--muted);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.staff-bus-help{display:block;margin-top:8px;color:var(--muted);font-size:9px}.staff-bus-access--empty{display:flex;flex-direction:column;gap:2px}.staff-bus-access--empty span{color:var(--muted);font-size:10px}
.staff-bus-count{display:inline-flex;margin-right:8px;padding:3px 6px;border-radius:7px;color:var(--brand);background:var(--brand-soft);font-size:9px;font-weight:800}
@media (max-width:640px){.staff-bus-grid{grid-template-columns:1fr;max-height:220px}.staff-bus-option{padding:9px}}
@media (max-width: 1230px) { .app-shell { padding-left:225px; }.sidebar { width:225px; }.topbar,.page { padding-left:25px; padding-right:25px; }.sales-workspace { grid-template-columns:235px minmax(300px,1fr); }.sales-right { grid-column:1 / -1; }.sales-right .booking-form { display:grid; grid-template-columns:repeat(2,1fr); gap:0 12px; }.sales-right .panel-heading { padding-bottom:5px; }.sales-right .booking-form > label:last-of-type,.sales-right .payment-note,.sales-right .button { grid-column:1 / -1; } }
@media (max-width: 1020px) { .stats-grid { grid-template-columns:repeat(2,1fr); }.dashboard-grid,.trip-layout,.report-grid { grid-template-columns:1fr; }.trip-info { max-width:480px; width:100%; margin:auto; }.owner-grid { grid-template-columns:repeat(2,1fr); }.support-grid { grid-template-columns:1fr; }.sales-workspace { grid-template-columns:230px minmax(280px,1fr); }.counter-grid { grid-template-columns:1fr; }.topbar { height:72px; }.sidebar { width:214px; }.app-shell{padding-left:214px;} }
@media (max-width: 780px) { body { padding-bottom:63px; }.app-shell { padding-left:0; }.sidebar { width:265px; left:-270px; transition:left .25s ease; box-shadow:10px 0 30px rgba(8,17,42,.2); }.sidebar.open { left:0; }.backdrop.open { display:block; position:fixed; inset:0; z-index:29; background:rgba(8,15,36,.45); }.topbar { height:62px; padding:0 16px; }.mobile-menu { width:36px; height:36px; display:grid; place-items:center; margin-right:8px; border:0; border-radius:8px; color:#4d3a87; background:var(--brand-soft); }.mobile-menu i { width:18px; height:18px; }.breadcrumb { font-size:11px; }.breadcrumb > span { display:none; }.role-select { display:none; }.topbar-end { gap:7px; }.profile-meta,.profile-button > i { display:none; }.profile-button { padding:0; }.page { padding:20px 16px 28px; }.page-heading { align-items:flex-start; flex-direction:column; gap:12px; margin-bottom:17px; }.page-heading h1 { font-size:23px; }.heading-actions { width:100%; }.heading-actions .button { flex:1; }.stats-grid { gap:9px; margin-bottom:10px; }.stat-card { min-height:119px; padding:13px; border-radius:13px; }.stat-card small { margin-top:8px; }.stat-card strong { font-size:18px; }.dashboard-grid { gap:10px; margin-bottom:10px; }.sales-chart-panel { min-height:295px; }.panel-heading { padding:16px 15px 8px; }.chart-wrap { height:203px; padding:0 5px; }.top-companies-panel { display:none; }.recent-panel .panel-heading--stack-mobile { align-items:flex-start; flex-direction:column; }.filter-row { width:100%; justify-content:space-between; }.table-scroll th { padding:9px 14px; }.table-scroll td { padding:11px 14px; }.bottom-nav { position:fixed; z-index:28; inset:auto 0 0; height:63px; display:grid; grid-template-columns:repeat(5,1fr); padding:5px 3px 4px; border-top:1px solid var(--line); background:rgba(255,255,255,.96); backdrop-filter:blur(10px); }.bottom-nav button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; border:0; color:#8b94a6; background:transparent; font-size:9px; }.bottom-nav button i { width:18px; height:18px; }.bottom-nav button.active { color:var(--brand); font-weight:800; }.bottom-nav button.active i { padding:3px; width:24px; height:24px; border-radius:7px; background:var(--brand-soft); }.toolbar { margin-bottom:13px; }.owner-grid { grid-template-columns:1fr; gap:10px; }.counter-summary { grid-template-columns:1fr; gap:8px; }.counter-summary > div { padding:12px; }.counter-grid { gap:10px; }.trip-row { grid-template-columns:45px minmax(130px,1fr) auto; gap:8px; padding:13px 14px; }.trip-row > :nth-child(3),.trip-row > :nth-child(4),.trip-row > :nth-child(5) { display:none; }.sales-heading { align-items:flex-start; }.sales-progress { align-self:center; }.sales-workspace { display:flex; flex-direction:column; gap:10px; }.sales-left,.sales-center,.sales-right { width:100%; }.sales-left { order:1; }.sales-center { order:2; }.sales-right { order:3; }.sales-right .booking-form { display:block; }.bus-seat-wrap { max-width:310px; min-height:305px; }.audit-filters { grid-template-columns:1fr 1fr; align-items:end; padding:11px; }.audit-filters .search-box { grid-column:1 / -1; }.audit-filters .button { width:100%; }.report-cards { grid-template-columns:1fr; gap:10px; }.report-grid { gap:10px; }.bar-chart { padding-left:15px; padding-right:15px; gap:8px; }.commission-card { max-width:none; }.settings-grid { grid-template-columns:1fr; gap:10px; }.ticket-actions { padding:14px 17px 18px; flex-wrap:wrap; }.ticket-actions .button:last-child { flex-basis:100%; }.ticket-preview { padding:0 17px; }.ticket-success { padding-left:45px; padding-right:45px; }.support-grid { gap:10px; }.support-card p { min-height:auto; }.notification-list article { padding:14px; } }
@media (max-width: 405px) { .topbar { padding:0 10px; }.page { padding-left:12px; padding-right:12px; }.breadcrumb strong { max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.stats-grid { grid-template-columns:1fr 1fr; }.stat-card { padding:11px; }.stat-card strong { font-size:16px; }.stat-card .delta { font-size:9px; }.filter-row .text-button { font-size:10px; }.sales-progress { transform:scale(.9); transform-origin:right center; }.seat-grid { gap:7px 8px; }.seat-button:nth-child(5n + 3) { margin-right:13px; }.bus-seat-wrap { padding-left:17px; padding-right:17px; }.selected-seat-summary { margin-left:10px; margin-right:10px; }.selected-seat-summary div { padding:8px 5px; }.counter-card { padding:14px; } }
/* ============ JatraBD Counter Login Portal ============ */
.is-locked { display:none!important; }
.login-screen {
  position:fixed;
  inset:0;
  z-index:60;
  overflow-y:auto;
  background:
    radial-gradient(circle at 12% 12%, rgba(171,139,255,.23), transparent 25%),
    radial-gradient(circle at 88% 84%, rgba(107,82,202,.13), transparent 31%),
    linear-gradient(135deg, #f7f5ff 0%, #eeebfa 100%);
  animation:login-in .32s ease;
}
@keyframes login-in { from { opacity:.35; } to { opacity:1; } }
body.authenticated .login-screen { display:none; }

.jpl { width:min(100%, 1210px); min-height:100%; display:grid; align-items:center; margin:0 auto; padding:24px; }
.jpl-stage {
  display:grid;
  grid-template-columns:minmax(0, 1.08fr) minmax(390px, .92fr);
  overflow:hidden;
  min-height:720px;
  border:1px solid rgba(109,83,194,.14);
  border-radius:30px;
  background:#fff;
  box-shadow:0 28px 70px rgba(49,31,115,.18);
}

/* The illustration replaces the previously remote counter-photo dependency. */
.jpl-hero {
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:720px;
  overflow:hidden;
  padding:31px 37px 27px;
  color:#fff;
  background:
    radial-gradient(circle at 78% 6%, rgba(190,172,255,.42), transparent 26%),
    radial-gradient(circle at 5% 97%, rgba(105,76,221,.44), transparent 35%),
    linear-gradient(145deg, #251166 0%, #41219e 48%, #26115d 100%);
}
.jpl-hero::before,
.jpl-hero::after { content:""; position:absolute; z-index:0; border-radius:50%; pointer-events:none; }
.jpl-hero::before { width:430px; height:430px; top:-252px; right:-175px; border:1px solid rgba(255,255,255,.16); box-shadow:0 0 0 44px rgba(255,255,255,.035), 0 0 0 89px rgba(255,255,255,.025); }
.jpl-hero::after { width:210px; height:210px; bottom:-125px; left:-98px; border:1px solid rgba(255,255,255,.13); }
.jpl-hero-grid { position:absolute; inset:0; z-index:0; opacity:.28; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.1) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px); background-size:34px 34px; mask-image:linear-gradient(140deg, rgba(0,0,0,.8), transparent 73%); }
.jpl-brand { position:relative; z-index:2; display:flex; align-items:center; gap:11px; }
.jpl-logo { width:47px; height:47px; flex:0 0 47px; filter:drop-shadow(0 7px 14px rgba(7,2,41,.23)); }
.jpl-logo svg { width:100%; height:100%; }
.jpl-brand-copy strong,.jpl-brand-copy small { display:block; }
.jpl-brand-copy strong { color:#fff; font-size:19px; font-weight:800; letter-spacing:-.3px; }
.jpl-brand-copy small { margin-top:1px; color:#d7cdfc; font-size:10.5px; font-weight:650; }
.jpl-hero-content { position:relative; z-index:2; max-width:420px; margin-top:64px; }
.jpl-live-badge { display:inline-flex; align-items:center; gap:8px; padding:7px 11px; border:1px solid rgba(255,255,255,.21); border-radius:999px; color:#eeeaff; background:rgba(255,255,255,.1); box-shadow:inset 0 1px rgba(255,255,255,.08); font-size:10.5px; font-weight:750; letter-spacing:.1px; }
.jpl-live-badge i { width:7px; height:7px; border-radius:50%; background:#7af0bd; box-shadow:0 0 0 4px rgba(122,240,189,.15); }
.jpl-hero-kicker { display:flex; align-items:center; gap:6px; margin:23px 0 9px; color:#cfc2ff; font-size:11px; font-weight:800; letter-spacing:.45px; }
.jpl-hero-kicker i { width:15px; height:15px; }
.jpl-hero-kicker svg { width:100%; height:100%; }
.jpl-hero-copy h1 { max-width:11em; margin:0; color:#fff; font-size:clamp(30px, 3.4vw, 45px); font-weight:800; letter-spacing:-1.05px; line-height:1.13; text-wrap:balance; }
.jpl-hero-copy p { max-width:31em; margin:13px 0 0; color:#dcd4f8; font-size:13px; line-height:1.72; }
.jpl-hero-cta { display:inline-flex; align-items:center; gap:8px; margin-top:22px; padding:12px 16px; border:1px solid rgba(255,255,255,.18); border-radius:12px; color:#371b8d; background:#fff; box-shadow:0 10px 24px rgba(16,6,59,.28); font-size:12.5px; font-weight:800; transition:transform .18s ease, box-shadow .18s ease, background .18s ease; }
.jpl-hero-cta:hover { background:#f6f3ff; transform:translateY(-2px); box-shadow:0 14px 28px rgba(16,6,59,.36); }
.jpl-hero-cta i { width:16px; height:16px; }

.jpl-terminal-visual { position:relative; z-index:1; width:100%; min-height:235px; margin-top:auto; }
.jpl-journey-art { position:absolute; z-index:1; width:min(100%, 530px); height:auto; right:-11px; bottom:-19px; overflow:visible; }
.jpl-bus-illustration { transform-box:fill-box; transform-origin:center; animation:jpl-bus-float 5s ease-in-out infinite; }
@keyframes jpl-bus-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
.jpl-hero-icon { position:absolute; z-index:3; top:20px; right:14px; width:49px; height:49px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.33); border-radius:16px; color:#4c2aa7; background:#fff; box-shadow:0 12px 25px rgba(16,6,59,.22); }
.jpl-hero-icon i { width:24px; height:24px; }
.jpl-hero-icon svg { width:100%; height:100%; }
.jpl-ticket-float { position:absolute; z-index:4; left:0; bottom:27px; display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid rgba(255,255,255,.22); border-radius:13px; color:#fff; background:rgba(34,15,99,.66); box-shadow:0 13px 28px rgba(15,5,56,.27); backdrop-filter:blur(10px); }
.jpl-ticket-float > i { width:23px; height:23px; flex:0 0 23px; padding:4px; border-radius:8px; color:#5f39c9; background:#fff; }
.jpl-ticket-float span,.jpl-ticket-float small,.jpl-ticket-float strong { display:block; }
.jpl-ticket-float small { color:#d6cdf8; font-size:9px; }
.jpl-ticket-float strong { margin-top:1px; font-size:10.5px; }
.jpl-seat-float { position:absolute; z-index:4; right:8px; top:20px; display:flex; align-items:center; gap:7px; padding:9px 10px; border:1px solid rgba(255,255,255,.27); border-radius:12px; color:#fff; background:rgba(255,255,255,.13); backdrop-filter:blur(10px); }
.jpl-seat-float > span { width:19px; height:19px; display:grid; place-items:center; border-radius:50%; color:#245b45; background:#8ef0c0; font-size:13px; font-weight:900; }
.jpl-seat-float small { color:#dcd4fb; font-size:8.5px; line-height:1.35; }
.jpl-seat-float small strong { color:#fff; font-size:9px; }
.jpl-hero-benefits { position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:8px 14px; margin-top:7px; color:#dcd5f9; font-size:10px; font-weight:700; }
.jpl-hero-benefits span { display:inline-flex; align-items:center; gap:5px; }
.jpl-hero-benefits i { width:13px; height:13px; color:#9ff0ca; }
.jpl-hero-benefits svg { width:100%; height:100%; }

.jpl-access { min-width:0; display:flex; flex-direction:column; padding:31px 36px 23px; background:#fff; }
.jpl-access-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.jpl-access-label { color:#8173a5; font-size:10.5px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; }
.jpl-lang { display:inline-flex; align-items:center; gap:6px; padding:7px 10px 7px 9px; border:1px solid #e7e1f4; border-radius:999px; color:#58478f; background:#fbfaff; font-size:11px; font-weight:750; }
.jpl-lang-icon { width:15px; height:15px; display:grid; place-items:center; }
.jpl-lang-icon svg { width:100%; height:100%; }
.jpl-lang select { border:0; outline:0; color:inherit; font:inherit; font-weight:750; background:transparent; cursor:pointer; }
.jpl-welcome { margin:29px 0 18px; }
.jpl-welcome h2 { margin:0 0 5px; color:#302652; font-size:25px; letter-spacing:-.55px; }
.jpl-welcome h2 span { font-size:20px; }
.jpl-welcome p { margin:0; color:#85809b; font-size:12.5px; }
.jpl-role-switch { display:grid; grid-template-columns:repeat(3, 1fr); gap:6px; padding:5px; border:1px solid #eae6f4; border-radius:13px; background:#f7f6fb; }
.jpl-role-choice { min-width:0; display:flex; align-items:center; justify-content:center; gap:5px; padding:9px 6px; border:0; border-radius:9px; color:#81799a; background:transparent; font-size:11px; font-weight:800; line-height:1.2; text-align:center; transition:.18s ease; }
.jpl-role-choice i { width:14px; height:14px; flex:0 0 14px; }
.jpl-role-choice svg { width:100%; height:100%; }
.jpl-role-choice:hover { color:#5734b4; background:#eeebfb; }
.jpl-role-choice.active { color:#fff; background:linear-gradient(135deg,#7445da,#5631bb); box-shadow:0 5px 11px rgba(86,49,187,.27); }

.jpl-login { scroll-margin-top:16px; margin-top:17px; padding:20px; border:1px solid #ebe6f5; border-radius:18px; background:#fff; box-shadow:0 10px 23px rgba(48,32,93,.055); }
.jpl-login-head { display:flex; align-items:center; gap:11px; margin-bottom:17px; }
.jpl-login-icon { width:42px; height:42px; flex:0 0 42px; display:grid; place-items:center; border-radius:13px; color:#fff; background:linear-gradient(135deg,#8055e5,#592dbf); box-shadow:0 8px 17px rgba(89,45,191,.24); }
.jpl-login-icon i { width:20px; height:20px; }
.jpl-login-icon svg { width:100%; height:100%; }
.jpl-login-head h2 { margin:0; color:#332958; font-size:16.5px; letter-spacing:-.2px; }
.jpl-login-head p { margin:2px 0 0; color:#89839f; font-size:11px; }
.jpl-demo-hint { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 0 15px; padding:9px 10px 9px 11px; border:1px solid #e8ddfb; border-radius:11px; color:#5b3b9f; background:#f7f3ff; font-size:10.5px; line-height:1.55; }
.jpl-demo-hint code { font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace; font-weight:750; white-space:nowrap; color:#421b84; }
.jpl-demo-chip { flex:0 0 auto; border:0; border-radius:8px; padding:5px 8px; color:#fff; background:linear-gradient(135deg,#7c3aed,#5b21b6); box-shadow:0 3px 8px rgba(124,58,237,.2); font-size:10px; font-weight:800; white-space:nowrap; transition:.15s ease; }
.jpl-demo-chip:hover { transform:translateY(-1px); box-shadow:0 5px 11px rgba(124,58,237,.31); }
.jpl-field { display:block; margin-bottom:13px; color:#4a4364; font-size:11.5px; font-weight:750; }
.jpl-input { display:flex; align-items:center; gap:9px; height:46px; margin-top:6px; padding:0 12px; border:1.5px solid #e7e2f1; border-radius:12px; background:#fff; transition:border-color .15s ease, box-shadow .15s ease; }
.jpl-input:focus-within { border-color:#7750dc; box-shadow:0 0 0 4px rgba(119,80,220,.11); }
.jpl-input.is-invalid { border-color:#eaa4ad; box-shadow:0 0 0 3px var(--red-soft); }
.jpl-input > i { width:17px; height:17px; flex:0 0 17px; color:#9b92be; }
.jpl-input svg { width:100%; height:100%; }
.jpl-input input { min-width:0; flex:1; height:100%; border:0; outline:0; color:var(--ink); font-size:12.5px; background:transparent; }
.jpl-input input::placeholder { color:#aaa3c0; font-weight:400; }
.jpl-eye { width:29px; height:29px; display:grid; place-items:center; border:0; border-radius:8px; color:#9a92c4; background:transparent; }
.jpl-eye:hover { color:var(--brand); background:var(--brand-soft); }
.jpl-eye i { width:16px; height:16px; }
.jpl-login-row { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:14px 0 16px; }
.jpl-check { display:inline-flex; align-items:center; gap:6px; color:#6d6684; font-size:11.5px; font-weight:700; cursor:pointer; }
.jpl-check input { width:15px; height:15px; margin:0; accent-color:#7045d5; }
.jpl-login-row .text-button { font-size:10.5px; }
.login-error { display:flex; align-items:flex-start; gap:8px; margin:0 0 12px; padding:9px 10px; border:1px solid #f5ccd2; border-radius:10px; color:#ac2f3f; background:var(--red-soft); font-size:10.5px; font-weight:700; }
.login-error i { width:14px; height:14px; flex:0 0 14px; margin-top:1px; }
.login-error svg { width:100%; height:100%; }
.login-error[hidden] { display:none; }
/* Shared (cross-device) login status line under the login button. */
.shared-auth-note { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 12px; padding:9px 10px; border-radius:10px; font-size:10.5px; font-weight:700; }
.shared-auth-note i { width:14px; height:14px; flex:0 0 14px; }
.shared-auth-note svg { width:100%; height:100%; }
.shared-auth-note[hidden] { display:none; }
.shared-auth-note.is-ok { border:1px solid #c6e5d3; color:#1c6b41; background:#effaf4; }
.shared-auth-note.is-down, #sharedAuthHelp { display:none !important; }
.shared-auth-note .text-button { font-size:10.5px; font-weight:800; text-decoration:underline; }
.jpl-submit { width:100%; height:47px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border:0; border-radius:12px; color:#fff; background:linear-gradient(135deg,#7441d4,#5426b9); box-shadow:0 10px 21px rgba(84,38,185,.28); font-size:13px; font-weight:800; transition:transform .18s ease, box-shadow .18s ease; }
.jpl-submit:hover { transform:translateY(-1px); box-shadow:0 14px 26px rgba(84,38,185,.35); }
.jpl-submit i { width:16px; height:16px; }
.jpl-submit.is-loading { pointer-events:none; box-shadow:none; }
.jpl-submit.is-loading::after { content:""; width:15px; height:15px; border:2.5px solid rgba(255,255,255,.4); border-top-color:#fff; border-radius:50%; animation:jpl-spin .7s linear infinite; }
@keyframes jpl-spin { to { transform:rotate(360deg); } }

.jpl-other-portals { margin-top:16px; }
.jpl-other-label { margin:0 0 8px; color:#8c849f; font-size:10.5px; font-weight:750; }
.jpl-acc { overflow:hidden; border:1px solid #ebe7f4; border-radius:13px; background:#fff; transition:box-shadow .2s ease, border-color .2s ease; }
.jpl-acc + .jpl-super { margin-top:8px; }
.jpl-acc.open,.jpl-super.open { border-color:#ddd3f5; box-shadow:0 8px 18px rgba(48,32,93,.07); }
.jpl-acc-head { width:100%; display:flex; align-items:center; gap:10px; padding:10px 12px; border:0; text-align:left; background:transparent; }
.jpl-acc-head:hover { background:#fcfbff; }
.jpl-acc-icon { width:35px; height:35px; flex:0 0 35px; display:grid; place-items:center; border-radius:10px; color:#7044d6; background:#f0ebff; }
.jpl-acc-icon i { width:18px; height:18px; }
.jpl-acc-icon svg { width:100%; height:100%; }
.jpl-acc-title { min-width:0; }
.jpl-acc-title strong { display:block; color:#40365f; font-size:12.5px; }
.jpl-acc-title small { display:block; margin-top:1px; overflow:hidden; color:#918aa4; font-size:9.5px; text-overflow:ellipsis; white-space:nowrap; }
.jpl-acc-chevron { width:15px; height:15px; flex:0 0 15px; margin-left:auto; color:#9c93b4; transition:transform .2s ease; }
.jpl-acc-chevron svg { width:100%; height:100%; }
.jpl-acc.open .jpl-acc-chevron,.jpl-super.open .jpl-acc-chevron { transform:rotate(90deg); }
.jpl-acc-panel { display:none; padding:1px 12px 12px; }
.jpl-acc.open .jpl-acc-panel,.jpl-super.open .jpl-acc-panel { display:block; animation:jpl-fade .2s ease; }
@keyframes jpl-fade { from { opacity:.3; transform:translateY(-3px); } to { opacity:1; transform:none; } }
.jpl-acc-panel p { margin:0 0 9px; color:#706982; font-size:10.5px; line-height:1.55; }
.jpl-acc-cta { display:inline-flex; align-items:center; gap:6px; padding:8px 10px; border:1px solid #ddd3fa; border-radius:9px; color:#5b21b6; background:#f7f3ff; font-size:10.5px; font-weight:800; transition:.18s ease; }
.jpl-acc-cta:hover { background:#efe7ff; transform:translateX(1px); }
.jpl-acc-cta.active { color:#fff; border-color:#7043d2; background:#7043d2; box-shadow:0 6px 13px rgba(91,33,182,.22); }
.jpl-acc-cta i { width:13px; height:13px; }
.jpl-super { overflow:hidden; border:1px solid #ebe7f4; border-radius:13px; background:#fff; transition:box-shadow .2s ease, border-color .2s ease; }
.jpl-super-head { gap:10px; }
.jpl-super-head .jpl-lock-mini { width:18px; height:18px; flex:0 0 18px; padding:4px; border-radius:7px; color:#6440bd; background:#f0ebff; }
.jpl-super-panel { text-align:left; }

.jpl-footer { margin-top:auto; padding-top:17px; text-align:center; }
.jpl-footer p { margin:0; color:#928aa5; font-size:10px; }
.jpl-heart { color:#7042d1; }
.jpl-support { margin-top:4px!important; font-size:10px!important; }
.jpl-support .text-button { font-size:10px; }
.login-noscript { margin:14px 0 0; padding:10px 12px; border:1px solid #f5ccd2; border-radius:11px; color:#ac2f3f; background:var(--red-soft); font-size:11px; font-weight:700; text-align:center; }

@media (max-width: 980px) {
  .jpl { width:min(100%, 680px); padding:20px; }
  .jpl-stage { grid-template-columns:1fr; min-height:0; }
  .jpl-hero { min-height:535px; padding:29px 33px 25px; }
  .jpl-access { padding:28px 33px 24px; }
  .jpl-hero-content { margin-top:45px; }
  .jpl-terminal-visual { min-height:210px; }
}
@media (max-width: 620px) {
  .jpl { width:100%; padding:0; align-items:start; }
  .jpl-stage { border:0; border-radius:0; box-shadow:none; }
  .jpl-hero { min-height:456px; padding:21px 20px 19px; }
  .jpl-hero-content { margin-top:34px; }
  .jpl-live-badge { padding:6px 9px; font-size:9.5px; }
  .jpl-hero-kicker { margin-top:18px; }
  .jpl-hero-copy h1 { font-size:31px; }
  .jpl-hero-copy p { margin-top:10px; font-size:11.5px; line-height:1.62; }
  .jpl-hero-cta { margin-top:17px; padding:10px 13px; font-size:11.5px; }
  .jpl-terminal-visual { min-height:188px; }
  .jpl-journey-art { width:495px; right:-66px; bottom:-25px; }
  .jpl-ticket-float { left:0; bottom:16px; padding:8px 9px; }
  .jpl-seat-float { right:0; top:10px; }
  .jpl-hero-icon { top:5px; right:8px; width:43px; height:43px; border-radius:13px; }
  .jpl-hero-icon i { width:20px; height:20px; }
  .jpl-hero-benefits { gap:5px 9px; margin-top:5px; font-size:8.5px; }
  .jpl-access { padding:21px 16px 19px; }
  .jpl-welcome { margin:23px 0 15px; }
  .jpl-welcome h2 { font-size:22px; }
  .jpl-login { margin-top:14px; padding:16px; border-radius:15px; }
  .jpl-demo-hint { align-items:flex-start; flex-direction:column; gap:7px; }
  .jpl-demo-chip { align-self:flex-end; margin-top:-4px; }
  .jpl-footer { margin-top:18px; }
}
@media (max-width: 390px) {
  .jpl-hero { min-height:445px; padding-left:16px; padding-right:16px; }
  .jpl-hero-copy h1 { font-size:28px; }
  .jpl-role-choice { padding:8px 3px; font-size:10px; }
  .jpl-role-choice i { display:none; }
  .jpl-login { padding:15px 13px; }
  .jpl-login-row { align-items:flex-start; flex-direction:column; }
  .jpl-login-row .text-button { margin-left:auto; margin-top:-2px; }
}
@media (prefers-reduced-motion: reduce) {
  .login-screen,.jpl-bus-illustration { animation:none; }
  .jpl-hero-cta,.jpl-submit,.jpl-role-choice,.jpl-demo-chip { transition:none; }
}
@media print { .login-screen { display:none!important; } }

@media print {
  body { background:#fff; }
  body[data-print="report"] .sidebar,
  body[data-print="report"] .topbar,
  body[data-print="report"] .bottom-nav,
  body[data-print="report"] .page:not(#reports) { display:none!important; }
  body[data-print="report"] .app-shell { padding:0; }
  body[data-print="report"] #reports { display:block!important; max-width:none; padding:18px; }
  body[data-print="report"] #reports .page-heading .button { display:none; }
  body[data-print="ticket"] .app-shell,
  body[data-print="ticket"] .bottom-nav,
  body[data-print="ticket"] #toast { display:none!important; }
  body[data-print="ticket"] .modal { visibility:visible!important; opacity:1!important; position:static!important; display:block!important; padding:0!important; background:#fff!important; }
  body[data-print="ticket"] .modal:not(#ticketModal) { display:none!important; }
  body[data-print="ticket"] .modal-card { width:100%!important; max-width:490px!important; margin:auto; box-shadow:none!important; overflow:visible!important; }
  body[data-print="ticket"] .modal-close,
  body[data-print="ticket"] .ticket-actions { display:none!important; }
}

/* ============ JatraBD Home Screen (নতুন ডিজাইন) ============ */
.hero-banner {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(300px, .88fr);
  gap: 20px;
  align-items: center;
  padding: 30px 38px;
  margin-bottom: 15px;
  overflow: hidden;
  border-radius: 22px;
  color: rgba(255,255,255,.92);
  background:
    radial-gradient(circle at 88% 4%, rgba(53,110,234,.55) 0, transparent 44%),
    radial-gradient(circle at 4% 100%, rgba(107,58,224,.6) 0, transparent 46%),
    linear-gradient(158deg, #101c40 0%, #1b2b62 52%, #140f33 100%);
  box-shadow: 0 18px 40px rgba(23, 32, 80, .22);
}
.hero-copy { position: relative; z-index: 1; }
.hero-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 11px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  color: #d7e1ff;
  font-size: 10px;
  font-weight: 700;
  background: rgba(255,255,255,.08);
}
.live-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: #37e39a;
  box-shadow: 0 0 0 0 rgba(55,227,154,.55);
  animation: live-ping 1.8s ease-out infinite;
}
@keyframes live-ping {
  0% { box-shadow: 0 0 0 0 rgba(55,227,154,.55); }
  70% { box-shadow: 0 0 0 7px rgba(55,227,154,0); }
  100% { box-shadow: 0 0 0 0 rgba(55,227,154,0); }
}
.hero-copy h2 { margin: 14px 0 8px; color: #fff; font-size: clamp(22px, 2.3vw, 31px); font-weight: 750; line-height: 1.22; letter-spacing: -.6px; }
.hero-copy > p { margin: 0; max-width: 34em; color: #b9c6e8; font-size: 12.5px; }
.hero-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.hero-stats > div { min-width: 118px; flex: 1; padding: 12px 14px; border: 1px solid rgba(255,255,255,.14); border-radius: 13px; background: rgba(255,255,255,.07); }
.hero-stats strong, .hero-stats small { display: block; }
.hero-stats strong { color: #fff; font-size: 20px; letter-spacing: -.4px; }
.hero-stats small { margin-top: 2px; color: #a9b7dd; font-size: 10px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }

/* A persistent home-page entry point for the staff-facing counter portal. */
.counter-portal-shortcut {
  display:grid;
  grid-template-columns:48px minmax(0, 1fr) auto;
  align-items:center;
  gap:14px;
  margin:0 0 15px;
  padding:15px 17px;
  border:1px solid #dcd3fa;
  border-radius:16px;
  color:#33245f;
  background:linear-gradient(100deg, #faf8ff 0%, #f0ebff 58%, #e8f8f0 100%);
  box-shadow:0 8px 20px rgba(62,42,126,.06);
}
.counter-portal-shortcut-icon { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; color:#fff; background:linear-gradient(135deg, #7550de, #4d28b5); box-shadow:0 7px 15px rgba(82,43,186,.24); }
.counter-portal-shortcut-icon i { width:24px; height:24px; }
.counter-portal-shortcut-copy { min-width:0; }
.counter-portal-shortcut-copy p { margin:0 0 1px; color:#745caa; font-size:10px; font-weight:800; letter-spacing:.35px; }
.counter-portal-shortcut-copy h2 { margin:0; color:#38266a; font-size:16px; letter-spacing:-.2px; }
.counter-portal-shortcut-copy span { display:block; margin-top:2px; color:#6f6887; font-size:11px; line-height:1.55; }
.counter-portal-launch { min-height:39px; white-space:nowrap; border-color:#5e35c8; background:linear-gradient(135deg, #7150d8, #4d2aae); }
.counter-portal-launch:hover { border-color:#4522a6; }

.button--light { border-color: #fff; color: #3a22a0; background: #fff; box-shadow: 0 8px 20px rgba(0,0,0,.18); }
.button--light:hover { background: #f4f1ff; box-shadow: 0 10px 24px rgba(0,0,0,.24); }
.hero-ghost { border-color: rgba(255,255,255,.3); color: #fff; background: rgba(255,255,255,.06); box-shadow: none; }
.hero-ghost:hover { background: rgba(255,255,255,.14); box-shadow: none; }
.hero-art { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; min-height: 215px; }
.hero-art svg { width: 100%; max-width: 430px; height: auto; overflow: visible; }
.hero-orbit { fill: rgba(255,255,255,.05); stroke: rgba(255,255,255,.14); stroke-width: 1.5; transform-box: fill-box; transform-origin: center; animation: hero-pulse 4.5s ease-in-out infinite; }
.hero-orbit-b { animation-delay: -2.2s; }
@keyframes hero-pulse { 0%, 100% { transform: scale(1); opacity: .75; } 50% { transform: scale(1.09); opacity: 1; } }
.hero-road { fill: none; stroke: rgba(255,255,255,.22); stroke-width: 2.5; stroke-dasharray: 7 10; stroke-linecap: round; }
.hero-pin { transform-box: fill-box; transform-origin: center; animation: hero-float 3s ease-in-out infinite; }
.hero-pin circle:first-child { fill: #ffd166; }
.hero-pin + .hero-pin { animation-delay: -1.4s; }
.hero-pin + .hero-pin circle:first-child { fill: #5ce0b0; }
.hero-bus { transform-box: fill-box; transform-origin: center; animation: hero-float 5s ease-in-out infinite; }
@keyframes hero-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }

.quick-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; margin-bottom: 15px; }
.quick-action {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  padding: 14px 15px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  box-shadow: var(--shadow);
  text-align: left;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.quick-action:hover { transform: translateY(-2px); border-color: #ddd3fb; box-shadow: 0 14px 30px rgba(30, 42, 80, .1); }
.quick-icon { flex: 0 0 auto; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; }
.quick-icon i { width: 20px; height: 20px; }
.qa-purple { color: #6a3de4; background: #efe9ff; }
.qa-blue { color: #356eea; background: #eaf0ff; }
.qa-green { color: #138c5a; background: #e5f7ed; }
.qa-orange { color: #e68a1e; background: #fff3de; }
.quick-text { flex: 1; min-width: 0; }
.quick-text strong, .quick-text small { display: block; }
.quick-text strong { color: var(--ink); font-size: 13px; }
.quick-text small { margin-top: 1px; color: var(--muted); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.quick-arrow { flex: 0 0 auto; width: 15px; height: 15px; color: #b6bdcb; }

.stat-value-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: 1px; }
.stat-value-row > strong { margin-top: 0; }
.spark { display: flex; align-items: flex-end; gap: 2.5px; height: 26px; padding-bottom: 2px; }
.spark i { width: 3.5px; border-radius: 2px; background: var(--accent); opacity: .4; }
.spark i:nth-last-child(-n+2) { opacity: .9; }

.departures-panel { margin-bottom: 15px; overflow: hidden; }
.departures { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.departure-card { display: flex; flex-direction: column; padding: 17px 19px 16px; border-top: 1px solid var(--line); }
.departures .departure-card + .departure-card { border-left: 1px solid var(--line); }
.dep-time { display: flex; align-items: baseline; gap: 7px; }
.dep-time strong { font-size: 16px; letter-spacing: -.3px; }
.dep-time small { color: var(--muted); font-size: 10px; }
.dep-route { min-width: 0; margin-top: 5px; }
.dep-route strong { display: block; color: var(--ink); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dep-route p { margin: 1px 0 0; color: var(--muted); font-size: 10px; }
.dep-seats { margin-top: 12px; }
.dep-seat-meta { display: flex; justify-content: space-between; color: var(--muted); font-size: 10px; }
.dep-seat-meta b { color: var(--green); }
.dep-bar { height: 6px; margin-top: 7px; border-radius: 6px; background: #eef0f6; overflow: hidden; }
.dep-bar i { display: block; height: 100%; border-radius: 6px; background: linear-gradient(90deg, #7b51f4, #4d24bd); }
.dep-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 14px; }
.dep-foot .status { gap: 5px; }
.dep-foot .live-dot { width: 6px; height: 6px; flex: 0 0 6px; }

@media (max-width: 1020px) {
  .hero-banner { grid-template-columns: 1fr; padding: 26px 28px; }
  .hero-art { min-height: 180px; }
  .quick-actions { grid-template-columns: repeat(2, 1fr); }
  .departures { grid-template-columns: 1fr; }
  .departures .departure-card + .departure-card { border-left: 0; }
}
@media (max-width: 780px) {
  .hero-banner { padding: 22px 20px; border-radius: 16px; }
  .hero-copy h2 { font-size: 22px; }
  .hero-stats > div { min-width: 0; flex: 1 1 30%; padding: 10px 12px; }
  .hero-stats strong { font-size: 17px; }
  .hero-art { display: none; }
  .hero-actions .button { flex: 1 1 auto; }
  .counter-portal-shortcut { grid-template-columns:42px minmax(0,1fr); gap:11px; padding:13px; border-radius:14px; }
  .counter-portal-shortcut-icon { width:42px; height:42px; border-radius:12px; }
  .counter-portal-shortcut-icon i { width:21px; height:21px; }
  .counter-portal-shortcut-copy h2 { font-size:14px; }
  .counter-portal-shortcut-copy span { font-size:10px; }
  .counter-portal-launch { grid-column:1 / -1; width:100%; }
  .quick-actions { gap: 9px; }
  .quick-action { padding: 12px 13px; }
  .quick-icon { width: 38px; height: 38px; border-radius: 11px; }
}
@media (max-width: 405px) {
  .hero-banner { padding: 20px 16px; }
  .hero-stats > div { flex: 1 1 100%; }
  .quick-actions { grid-template-columns: 1fr; }
  .quick-action { padding: 11px 12px; }
}

/* Empty-first records: no placeholder statistics, seats or business cards. */
[hidden] { display:none!important; }
button:disabled { cursor:not-allowed; opacity:.5; }
.empty-state { grid-column:1 / -1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; min-height:210px; padding:30px 20px; color:var(--muted); text-align:center; }
.empty-state h3 { margin:0; color:var(--ink); font-size:16px; }
.empty-state p { max-width:350px; margin:0; font-size:12px; line-height:1.8; }
.empty-state .button { margin-top:8px; }
.empty-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:14px; background:var(--brand-soft); color:var(--brand); }
.empty-icon i { width:25px; height:25px; }
.owner-grid > .empty-state,.counter-grid > .empty-state { background:#fff; border:1px dashed #d9d1ef; border-radius:16px; min-height:280px; }
.empty-cell { padding:34px 18px!important; text-align:center; color:var(--muted); white-space:normal!important; }
.company-list .empty-list-item { display:block; padding:0; border:0; }
.company-list .empty-state { min-height:220px; padding:20px 10px; }
#tripInfo > .empty-state { min-height:260px; padding:15px 0; }
#salesTripList > .empty-state { min-height:180px; padding:20px 4px; }
#salesTripList .empty-state h3 { font-size:13px; }
#salesTripList .empty-state p { font-size:11px; }
#salesTripList .empty-state .button { font-size:11px; }
.local-data-note,.storage-notice { display:flex; gap:9px; align-items:flex-start; margin:0 0 18px; padding:12px 15px; border:1px solid #e5dff4; border-radius:10px; background:#f8f6fd; color:#62537e; font-size:11px; line-height:1.8; }
.local-data-note > i { flex:none; width:17px; height:17px; margin-top:2px; }
.storage-notice { margin:18px 24px 0; border-color:#f0c488; background:#fff6e8; color:#784b14; }
.settings-note { color:var(--muted); font-size:12px; line-height:1.9; }
.booking-fields { min-width:0; width:100%; padding:0; margin:0; border:0; }
.booking-fields:disabled { opacity:.6; }
.simple-modal select { width:100%; min-height:40px; margin-top:4px; padding:0 10px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--ink); font:inherit; }
.simple-modal input:focus,.simple-modal select:focus { outline:2px solid #a58adf; outline-offset:1px; }
.simple-modal .input-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
#recentPeriod { padding:6px 8px; border:1px solid var(--line); border-radius:8px; background:#fff; color:var(--muted); font:inherit; font-size:11px; }
.text-label { color:var(--muted); font-size:11px; white-space:nowrap; }
.trip-time small { white-space:normal; font-size:9px; line-height:1.6; }
.trip-route { min-width:0; overflow-wrap:anywhere; }
.trip-route > small { color:var(--muted); font-size:10px; }
.sales-trip-card > small { display:block; color:var(--muted); font-size:11px; }
.owner-card h2,.counter-card h2,.dep-route strong { overflow-wrap:anywhere; }
@media (max-width: 780px) {
  .empty-state { min-height:200px; padding:24px 14px; }
  .local-data-note { padding:10px 12px; }
  .heading-actions { flex-wrap:wrap; }
  .trip-row { grid-template-columns:64px minmax(100px,1fr) auto; }
}
@media (min-width: 781px) and (max-width: 1230px) {
  .sales-right .booking-form { display:block; }
  .sales-right .booking-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; }
  .sales-right .booking-fields > label:last-of-type,
  .sales-right .booking-fields > .payment-note,
  .sales-right .booking-fields > .button { grid-column:1 / -1; }
}

/* ============ JatraBD visual redesign v1 ============ */
:root{--ink:#18324f;--muted:#718096;--line:#e4ebf3;--canvas:#f5f8fc;--paper:#fff;--brand:#0b7bea;--brand-dark:#075db5;--brand-soft:#eaf4ff;--navy:#062b52;--navy-2:#0b3e70;--green:#12a56b;--green-soft:#e7f8f1;--orange:#f1a72b;--orange-soft:#fff5df;--shadow:0 10px 30px rgba(20,60,100,.07);--radius:14px;--radius-sm:10px}
body{background:var(--canvas);color:var(--ink)}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline-color:rgba(11,123,234,.28)}
.sidebar{background:linear-gradient(160deg,#062b52 0%,#073866 62%,#082c4f 100%);box-shadow:4px 0 24px rgba(4,35,66,.08)}
.brand-mark{background:linear-gradient(135deg,#20a0ff,#0872d8);box-shadow:0 7px 18px rgba(0,122,230,.22)}
.nav-item:hover,.nav-item.active,.support-link:hover{background:rgba(37,151,239,.18)}
.nav-item.active{box-shadow:inset 3px 0 0 #39a8ff}
.topbar{border-bottom-color:#e7edf4;background:rgba(255,255,255,.94)}
.button{border-color:var(--brand);background:linear-gradient(135deg,#1291f7,#0871db);box-shadow:0 5px 13px rgba(11,123,234,.16)}
.button:hover{box-shadow:0 7px 17px rgba(11,123,234,.23)}
.button--secondary{border-color:#cfe3f8;color:var(--brand);background:#fff}.button--secondary:hover{background:var(--brand-soft)}
.page-heading h1{color:#123251}.eyebrow{color:var(--brand)!important}
.panel,.stat-card,.owner-card,.counter-card,.trip-table,.settings-grid .panel,.support-card{border-color:#e3ebf3;box-shadow:0 8px 24px rgba(20,60,100,.05)}
.mobile-menu{color:#0b6fca;background:var(--brand-soft)}
.sales-trip-card.active{border-color:#0b7bea;box-shadow:0 0 0 2px rgba(11,123,234,.08)}.sales-trip-card:hover{border-color:#9cccf5}
.seat-button.selected{background:#10a56b;border-color:#10a56b}.seat-button.booked{background:#ffe3e6;border-color:#f1a1ab;color:#b84d59}.seat-button.blocked{background:#edf1f5;border-color:#d5dce5;color:#98a2ae}.seat-button:not(.booked):not(.blocked):not(.selected):hover{border-color:#0b7bea;color:#0b7bea;background:#edf7ff}
.fare-rule{display:block;margin-top:6px;color:#7a8796;font-size:9px}
.simple-modal input,.simple-modal select,.simple-modal textarea{border-color:#dce6ef;border-radius:9px}.simple-modal input:focus,.simple-modal select:focus,.simple-modal textarea:focus{border-color:#74b8ef;box-shadow:0 0 0 3px rgba(11,123,234,.09)}
.login-screen{background:linear-gradient(135deg,#f4f9ff 0%,#edf5fc 100%)}
.jpl-stage{border-color:#dbe9f5;box-shadow:0 28px 70px rgba(17,64,103,.13)}
.jpl-hero{background:radial-gradient(circle at 78% 6%,rgba(63,176,255,.35),transparent 26%),radial-gradient(circle at 5% 97%,rgba(12,91,165,.45),transparent 35%),linear-gradient(145deg,#06315b 0%,#0873ca 48%,#062e56 100%)}
.jpl-hero-cta{background:#fff;color:#086cc0;box-shadow:0 10px 26px rgba(0,0,0,.12)}
.jpl-role-choice.active,.jpl-role-choice:hover{color:#0873ca;background:#edf7ff;border-color:#c7e4fb}
.jpl-submit{background:linear-gradient(135deg,#1591f5,#0872db)!important}
.jpl-input:focus-within{border-color:#71b7ec;box-shadow:0 0 0 3px rgba(11,123,234,.08)}

/* ============ JatraBD reference screens: home/search/seat v2 ============ */
.sales-heading { align-items:flex-end; }
.sales-heading .eyebrow { letter-spacing:.7px; }
.sales-progress { display:flex; align-items:center; gap:7px; padding:8px 11px; border:1px solid #dbe8f5; border-radius:999px; background:#fff; box-shadow:0 7px 18px rgba(20,60,100,.05); }
.sales-progress > span { width:25px; height:25px; display:grid; place-items:center; border-radius:50%; color:#718096; background:#edf2f7; font-size:10px; font-weight:800; }
.sales-progress > span.active { color:#fff; background:linear-gradient(135deg,#1494f6,#0871d9); box-shadow:0 5px 12px rgba(11,123,234,.2); }
.sales-progress > i { width:20px; height:1px; background:#dbe4ee; }
.sales-progress small { margin-left:2px; color:#8190a2; font-size:9px; font-weight:700; }
.sales-workspace { align-items:start; gap:14px; }
.sales-left,.sales-center,.sales-right { border-radius:16px; background:#fff; box-shadow:0 9px 28px rgba(20,60,100,.055); }
.sales-left,.sales-right { position:sticky; top:18px; }
.trip-search-form { gap:9px; }
.trip-search-form label { color:#5d7187; font-size:10.5px; font-weight:750; }
.trip-search-form select,.trip-search-form input { min-height:42px; border-color:#dce7f1; border-radius:10px; background:#fbfdff; }
.trip-search-form select:focus,.trip-search-form input:focus { border-color:#74b8ef; box-shadow:0 0 0 3px rgba(11,123,234,.08); }
.trip-results-label { margin-top:17px; padding-top:14px; border-top:1px solid #edf1f5; }
.sales-trip-list { gap:9px; }
.sales-trip-card { position:relative; overflow:hidden; padding:13px 13px 12px; border:1px solid #e1e9f1; border-radius:13px; background:#fff; box-shadow:0 3px 12px rgba(25,65,105,.035); text-align:left; }
.sales-trip-card::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:transparent; }
.sales-trip-card:hover { transform:translateY(-1px); border-color:#9ecdf4; box-shadow:0 8px 20px rgba(25,95,150,.08); }
.sales-trip-card.active { border-color:#77baf0; background:#f8fcff; box-shadow:0 0 0 2px rgba(11,123,234,.08),0 8px 22px rgba(25,95,150,.07); }
.sales-trip-card.active::before { background:#0b7bea; }
.sales-trip-card p { margin:8px 0 4px; color:#173957; font-size:12.5px; font-weight:800; }
.sales-trip-route { display:flex; align-items:center; gap:5px; min-width:0; color:#536d85; font-size:10.5px; font-weight:700; }
.sales-trip-route span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sales-trip-route i { width:12px; height:12px; flex:0 0 12px; color:#0b7bea; }
.sales-trip-meta { display:block; margin-top:5px; color:#8a9aaa; font-size:9px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sales-trip-card-bottom { margin-top:9px; padding-top:9px; border-top:1px dashed #e2eaf2; }
.sales-trip-card-bottom b { color:#0b6fca; font-size:13px; }
.fare-rule { color:#8a9aaa; }
.sales-center .panel-heading { padding-bottom:12px; border-bottom:1px solid #edf1f5; }
.seat-legend { justify-content:center; gap:14px; padding:11px 0 6px; color:#718096; font-size:9.5px; }
.seat-icon { width:17px; height:14px; border-radius:4px 4px 3px 3px; border:1px solid #cfdbe7; }
.bus-seat-wrap { margin:11px auto 4px; width:min(100%,310px); padding:13px 15px 17px; border:1px solid #dce7f1; border-radius:22px; background:linear-gradient(180deg,#f9fcff,#f4f8fc); box-shadow:inset 0 1px 0 #fff; }
.bus-front { width:82%; height:38px; margin:0 auto 13px; display:flex; align-items:center; justify-content:center; gap:8px; border-bottom:1px solid #dbe5ef; color:#7a8da0; font-size:9px; }
.bus-front i { width:18px; height:18px; color:#0b7bea; }
.seat-grid { grid-template-columns:repeat(5, minmax(0,1fr)); gap:8px 9px; padding:2px 7px; }
.seat-grid > span { min-height:34px; }
.seat-button { min-height:35px; border-radius:8px 8px 5px 5px; border-width:1px; font-size:9.5px; font-weight:800; }
.seat-button:not(.booked):not(.blocked):not(.selected) { background:#fff; border-color:#cfe0ed; color:#47627b; }
.seat-button.selected { box-shadow:0 5px 12px rgba(18,165,107,.2); }
.selected-seat-summary { margin-top:13px; padding:12px 10px; border:1px solid #dce8f2; border-radius:12px; background:#f7fbff; }
.selected-seat-summary div + div { border-left-color:#dce8f2; }
.selected-seat-summary strong { color:#123a5d; }
.sales-right .booking-form label { color:#5d7187; font-size:10.5px; font-weight:750; }
.sales-right .booking-form input,.sales-right .booking-form select { min-height:41px; border-color:#dce7f1; border-radius:9px; }
.sales-right .payment-note { border-color:#d9e8f4; background:#f4f9fd; color:#64788d; }
.sales-right .button--full { min-height:44px; }
@media (max-width:1050px) {
  .sales-workspace { grid-template-columns:1fr 1.1fr; }
  .sales-right { grid-column:1 / -1; position:static; }
}
@media (max-width:760px) {
  .sales-heading { align-items:flex-start; }
  .sales-progress { display:none; }
  .sales-left,.sales-center,.sales-right { position:static; }
  .sales-workspace { grid-template-columns:1fr; }
  .sales-left { order:1; }
  .sales-center { order:2; }
  .sales-right { order:3; }
  .seat-grid { gap:7px; padding:2px 2px; }
  .seat-button { min-height:34px; }
}


/* ============ JatraBD Phase 3: passenger + payment + confirmation ============ */
.fare-policy{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:4px 0 2px;padding:10px 11px;border:1px solid #dce8f2;border-radius:10px;background:#f7fbff;color:#667b90;font-size:9.5px}
.fare-policy span{display:flex;flex-direction:column;gap:2px}
.fare-policy strong{color:#0b6fca;font-size:11px}
.payment-amount-field input{font-weight:800;color:#123a5d}
.confirmation-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0;padding:9px 11px;border:1px solid #d9eee5;border-radius:10px;background:#f3fbf7}
.confirmation-badge{display:inline-flex;align-items:center;gap:5px;color:#118458;font-size:9px;font-weight:900;letter-spacing:.5px}
.confirmation-badge i{width:14px;height:14px}
.confirmation-hint{color:#718096;font-size:9px}
.ticket-success>div{min-width:0}
.ticket-success>div strong{display:block;color:#173957;font-size:15px}
.ticket-success>div p{margin:3px 0 0;color:#718096;font-size:10px}
.ticket-actions{flex-wrap:wrap}
.ticket-actions [data-view="sales"]{flex-basis:100%}
@media(max-width:760px){
  .fare-policy{grid-template-columns:1fr}
  .confirmation-actions{align-items:flex-start;flex-direction:column}
}


/* ============================================================
   JatraBD v11 — Blue/White reference theme
   Visual-only layer: keeps existing HTML, IDs, JS behavior,
   data flow, booking flow, and page structure unchanged.
   ============================================================ */
:root{
  --brand:#0b7bea;
  --brand-dark:#075db5;
  --brand-soft:#eaf4ff;
  --navy:#082c4f;
  --navy-2:#0b3e70;
  --line:#dce7f1;
  --canvas:#f5f8fc;
  --paper:#fff;
  --ink:#18324f;
  --muted:#718096;
  --shadow:0 10px 30px rgba(17,62,102,.07);
}
body{background:var(--canvas);color:var(--ink)}
.sidebar{
  background:linear-gradient(158deg,#082c4f 0%,#0b3e70 62%,#062b52 100%);
}
.brand-mark{background:linear-gradient(135deg,#20a0ff,#0872d8)}
.nav-item:hover,.nav-item.active,.support-link:hover{background:rgba(32,160,255,.16)}
.nav-item.active{box-shadow:inset 3px 0 0 #39a8ff}
.nav-item b{background:rgba(255,255,255,.13)}
.topbar{background:rgba(255,255,255,.94);border-bottom-color:#dce7f1}
.role-select select{
  background-color:#fff;
  color:#35536f;
}
.button{
  border-color:#0b7bea;
  background:linear-gradient(135deg,#20a0ff,#0872d8);
  box-shadow:0 6px 15px rgba(11,123,234,.16);
}
.button:hover{box-shadow:0 8px 20px rgba(11,123,234,.22)}
.button--secondary{border-color:#cfe3f8;color:#0872d8;background:#fff}
.button--secondary:hover{background:#edf7ff}
.eyebrow{color:#0b7bea!important}
.mobile-menu{color:#0872d8;background:#eaf4ff}
.page-heading h1{color:#18324f}
.panel,.card,.stat-card,.table-panel,.trip-table,.sales-left,.sales-center,.sales-right,
.owner-card,.counter-card,.report-card,.support-card,.settings-card{
  border-color:#dce7f1;
  box-shadow:0 8px 24px rgba(17,62,102,.045);
}
.search-box{border-color:#dce7f1}
.search-box:focus-within{border-color:#74b8ef;box-shadow:0 0 0 3px #edf7ff}
.trip-search-form select:focus,.trip-search-form input:focus,
.booking-form input:focus,.booking-form select:focus,
.company-settings input:focus{
  border-color:#74b8ef!important;
  box-shadow:0 0 0 3px #edf7ff!important;
}
.sales-trip-card.active{border-color:#77baf0;background:#f8fcff}
.sales-trip-card.active::before{background:#0b7bea}
.sales-trip-card:hover{background:#f8fcff}
.sales-trip-card-bottom b{color:#0b6fca}
.seat-icon.selected{border-color:#0b7bea;background:#0872d8}
.seat-button.selected{border-color:#0872d8;color:#fff;background:#0872d8}
.seat-button:not(.booked):not(.blocked):not(.selected):hover{
  border-color:#0b7bea;color:#0b7bea;background:#edf7ff
}
.seat-count,.status--success{color:#0b7bea;background:#eaf4ff}
.bus-seat-wrap{border-color:#dce7f1;background:linear-gradient(180deg,#f9fcff,#f4f8fc)}
.bus-front{color:#0872d8;background:#eaf4ff}
.selected-seat-summary strong{color:#075db5}
.payment-note{border-color:#cfe3f8;color:#47627b;background:#f4f9fd}
.sales-progress span.active{border-color:#0b7bea;background:#0b7bea}
.bottom-nav button.active{color:#0b7bea}
.bottom-nav button.active i{background:#eaf4ff}
.issued-ticket{border-color:#9ecdf4}
.issued-ticket-header{background:linear-gradient(135deg,#1291f7,#0871db)}
.issued-route i,.ticket-code{color:#0b7bea}
.ticket-actions .button{background:linear-gradient(135deg,#20a0ff,#0872d8)}


/* ============================================================
   JatraBD v12 — Full reference UI system
   Purpose: bring every existing portal/view closer to the
   supplied 12-screen JatraBD reference sheet.
   Visual-only: no JS selectors, data structures or workflows
   are changed by this layer.
   ============================================================ */
:root{
  --ref-blue:#0b83e8;
  --ref-blue-dark:#0868bf;
  --ref-blue-soft:#eef7ff;
  --ref-navy:#062b52;
  --ref-text:#102d49;
  --ref-muted:#78889a;
  --ref-border:#dce7f1;
  --ref-bg:#f6f9fc;
  --ref-green:#12a56b;
  --ref-green-soft:#e9f8f1;
  --ref-red:#ef6b73;
  --ref-red-soft:#fff0f1;
  --ref-yellow:#f2b84b;
  --ref-yellow-soft:#fff7e6;
  --ref-shadow:0 8px 24px rgba(23,72,112,.055);
  --ref-radius:12px;
}
html,body{background:var(--ref-bg);color:var(--ref-text)}
body{font-size:13px}
.app-shell{padding-left:228px;background:var(--ref-bg)}
.sidebar{
  width:228px;
  padding:17px 12px 14px;
  background:linear-gradient(180deg,#062b52 0%,#073866 58%,#052746 100%);
  box-shadow:none;
}
.brand{padding:4px 9px 18px;gap:8px}
.brand-mark{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,#1597f5,#0871d8);box-shadow:none}
.brand-mark svg{width:26px;height:26px}
.brand strong{font-size:16px;letter-spacing:-.35px}
.brand small{font-size:9px;color:#a9c9e8}
.account-card{margin:0 2px 16px;padding:9px;border-radius:10px;background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.08)}
.account-card .avatar{width:30px;height:30px}
.account-card strong{font-size:11px}
.account-card span{font-size:9px}
.nav-menu{gap:2px}
.nav-label{margin:5px 9px 6px;font-size:9px;color:#86a6c7}
.nav-item,.support-link{min-height:36px;padding:7px 9px;border-radius:7px;font-size:11px;gap:9px}
.nav-item i,.support-link i{width:15px;height:15px;flex-basis:15px}
.nav-item.active{box-shadow:none;background:#0b83e8}
.nav-item:hover,.support-link:hover{background:rgba(30,153,240,.16)}
.nav-item b{min-width:17px;height:17px;font-size:9px}
.sidebar-bottom{padding-top:12px}
.sidebar-bottom span{padding:10px 9px 0;font-size:9px}

.topbar{
  height:64px;
  padding:0 28px;
  border-bottom:1px solid #e2eaf2;
  background:#fff;
  backdrop-filter:none;
}
.breadcrumb{font-size:11px;gap:6px}
.breadcrumb strong{font-size:11px}
.topbar-end{gap:8px}
.icon-button{width:34px;height:34px;border-radius:8px}
.profile-button{padding-left:4px}
.profile-button .avatar{width:30px;height:30px}
.profile-meta strong{font-size:10px}
.profile-meta small{font-size:8px}

.page{
  max-width:1400px;
  padding:25px 28px 42px;
}
.page-heading{margin-bottom:18px;align-items:flex-end}
.page-heading h1{font-size:25px;letter-spacing:-.8px;color:#102d49}
.page-heading p{font-size:11px}
.eyebrow{font-size:10px!important;color:var(--ref-blue)!important;letter-spacing:.25px}
.heading-actions{gap:7px}
.button{
  min-height:36px;
  padding:7px 12px;
  border-radius:7px;
  font-size:11px;
  background:linear-gradient(135deg,#1494f6,#0872db);
  box-shadow:0 5px 12px rgba(11,131,232,.14)
}
.button--secondary{color:#0872d8;border-color:#cfe3f2;background:#fff}
.panel,.stat-card,.owner-card,.counter-card,.trip-table,.sales-left,.sales-center,.sales-right,.report-card,.support-card{
  border-color:var(--ref-border);
  border-radius:var(--ref-radius);
  box-shadow:var(--ref-shadow)
}
.panel-heading{padding:16px 17px 9px}
.panel-heading h2{font-size:13px}
.panel-heading p{font-size:9px}
.text-button{font-size:10px}

/* Dashboard — compact reference-card layout */
.counter-portal-shortcut{border-radius:10px;border-color:#d8e7f3;background:#fff;box-shadow:var(--ref-shadow)}
.hero-banner{
  border-radius:12px;
  padding:21px 24px;
  min-height:168px;
  background:linear-gradient(135deg,#0869b9 0%,#0d8ce9 58%,#075ba6 100%);
  box-shadow:0 10px 25px rgba(8,105,185,.14)
}
.hero-copy h2{font-size:22px}
.hero-copy p{font-size:10px}
.hero-chip{font-size:9px}
.hero-stats{gap:9px}
.hero-stats>div{padding:8px 10px;border-radius:8px;background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.14)}
.hero-stats small{font-size:8px}
.hero-stats strong{font-size:16px}
.quick-actions{gap:10px;margin:14px 0}
.quick-action{padding:12px 13px;border:1px solid var(--ref-border);border-radius:10px;box-shadow:var(--ref-shadow);background:#fff}
.quick-icon{width:36px;height:36px;border-radius:9px}
.quick-text strong{font-size:11px}
.quick-text small{font-size:9px}
.stats-grid{gap:10px;margin-bottom:12px}
.stat-card{min-height:105px;padding:13px;border-radius:10px}
.stat-icon{width:30px;height:30px;border-radius:8px}
.stat-card small{font-size:9px;margin-top:8px}
.stat-card strong{font-size:18px}
.stat-card .delta{font-size:8px}
.dashboard-grid{gap:12px;margin-bottom:12px}
.sales-chart-panel{min-height:290px}
.chart-wrap{height:205px}
.chart-line{stroke:var(--ref-blue)}
.chart-dots circle{stroke:var(--ref-blue)}
.chart-dots circle:last-child{fill:var(--ref-blue)}
.company-list{padding:0 13px 8px}
.company-list li{padding:9px 3px}
.departures-panel{margin-bottom:12px}
.departure-card{padding:13px 15px}
.recent-panel .table-scroll th{padding:8px 16px;font-size:9px}
.recent-panel .table-scroll td{padding:10px 16px;font-size:10px}

/* Owner/admin pages */
.toolbar{margin-bottom:12px}
.search-box{height:37px;border-radius:7px;border-color:var(--ref-border)}
.owner-grid{gap:11px}
.owner-card{padding:14px}
.owner-card .company-logo{width:36px;height:36px;border-radius:10px}
.owner-card h2{font-size:12px}
.owner-card p,.owner-contact small{font-size:9px}
.owner-contact{padding:10px 0;margin:10px 0}
.owner-contact strong{font-size:10px}
.trip-layout{gap:12px}
.trip-table-header{padding:15px 17px}
.trip-table-header h2{font-size:13px}
.trip-row{grid-template-columns:55px minmax(145px,1.2fr) minmax(100px,1fr) 70px 60px 70px;gap:8px;padding:11px 17px}
.trip-time{font-size:10px}
.trip-route strong{font-size:10px}
.trip-route p,.trip-time small{font-size:8px}
.trip-info{padding:14px}
.trip-info h2{font-size:13px}
.trip-info-stats{margin:11px 0}
.counter-summary{gap:10px;margin-bottom:12px}
.counter-summary>div{padding:12px;border-radius:10px}
.counter-summary i{width:32px;height:32px;padding:7px}
.counter-summary strong{font-size:15px}
.counter-grid{gap:11px}
.counter-card{padding:14px}
.counter-card h2{font-size:12px}
.counter-card p{font-size:9px}
.counter-icon{width:32px;height:32px;padding:7px}
.staff-panel{border-radius:10px}
.staff-person .avatar{width:28px;height:28px}

/* Sales/search/seat selection — reference screen 2/3 */
.sales-heading{margin-bottom:14px}
.sales-workspace{grid-template-columns:245px minmax(340px,1fr) 250px;gap:11px}
.sales-left,.sales-center,.sales-right{border-radius:10px}
.trip-search-form,.booking-form{padding:4px 14px 14px}
.trip-search-form label,.booking-form>label{font-size:9px;margin-bottom:9px}
.trip-search-form select,.trip-search-form input,.sales-right .booking-form input,.sales-right .booking-form select{min-height:37px;border-radius:7px;font-size:10px}
.trip-results-label{margin-top:12px;padding-top:11px;font-size:9px}
.sales-trip-list{gap:7px}
.sales-trip-card{padding:10px;border-radius:8px}
.sales-trip-card p{font-size:10px;margin:6px 0 3px}
.sales-trip-route{font-size:8px}
.sales-trip-meta{font-size:8px}
.sales-trip-card-bottom{margin-top:7px;padding-top:7px}
.sales-trip-card-bottom b{font-size:11px}
.sales-center .panel-heading{padding:14px 15px 9px}
.seat-legend{padding:8px 0 4px;font-size:8px}
.bus-seat-wrap{width:min(100%,285px);padding:10px 11px 13px;border-radius:15px}
.bus-front{height:31px;margin-bottom:9px}
.seat-grid{gap:6px 7px;padding:2px 5px}
.seat-button{min-height:29px;border-radius:6px;font-size:8px}
.selected-seat-summary{margin-top:9px;padding:9px;border-radius:8px}
.sales-right .booking-form label{font-size:9px}
.sales-right .payment-note{font-size:8px}
.sales-right .button--full{min-height:38px}

/* Form-heavy screens — reference screen 10 */
.trip-form,.form-grid,.modal-form{font-size:10px}
.simple-modal input,.simple-modal select,.simple-modal textarea{min-height:37px;border-radius:7px}
.form-modal-content,.form-modal .modal-card{border-radius:12px}
.form-modal .modal-card{max-width:580px}
.form-modal .modal-header{padding:15px 17px}
.form-modal .modal-body{padding:15px 17px}
.form-modal .modal-footer{padding:12px 17px}

/* Audit / reports / notifications / settings / support */
.audit-filters{padding:11px;border:1px solid var(--ref-border);border-radius:10px;background:#fff;box-shadow:var(--ref-shadow)}
.report-cards{gap:10px}
.report-card{padding:13px;border-radius:10px}
.report-card h3{font-size:9px}
.report-card strong{font-size:18px}
.report-grid{gap:11px}
.notification-list{gap:8px}
.notification-item{padding:11px 12px;border:1px solid var(--ref-border);border-radius:9px;background:#fff}
.settings-grid{gap:11px}
.company-settings{padding:14px}
.company-settings label{font-size:9px}
.settings-note{font-size:10px}
.support-grid{gap:11px}
.support-card{padding:14px}
.support-card h3{font-size:12px}
.support-card p{font-size:9px}

/* Ticket / confirmation — reference screen 6/12 */
.ticket-modal-card{max-width:560px;border-radius:12px}
.ticket-preview{border-color:#dce7f1}
.ticket-success{background:#fff}
.confirmation-badge{color:#119363}
.issued-ticket-header{background:linear-gradient(135deg,#0e8ff2,#0870d5)}
.ticket-actions .button{background:linear-gradient(135deg,#1494f6,#0872db)}
.ticket-code{color:#0872d8}

/* Login — reference screen 8 */
.login-screen{background:#f5f8fc}
.jpl-stage{max-width:1120px;border-radius:14px;border-color:#dbe7f1;box-shadow:0 18px 50px rgba(24,72,112,.12)}
.jpl-hero{background:linear-gradient(160deg,#0666b6 0%,#0b8de9 52%,#07569d 100%)}
.jpl-brand-copy strong{font-size:18px}
.jpl-role-choice.active,.jpl-role-choice:hover{color:#0872d8;border-color:#cfe5f6;background:#edf7ff}
.jpl-submit{background:linear-gradient(135deg,#1494f6,#0872db)!important}
.jpl-input:focus-within{border-color:#73b8eb;box-shadow:0 0 0 3px rgba(11,131,232,.08)}
.jpl-access{background:#fff}
.jpl-login{border-color:#dce7f1;box-shadow:0 7px 20px rgba(25,70,110,.05)}
.jpl-acc{border-color:#dce7f1}
.jpl-acc-cta{color:#0872d8;border-color:#cfe3f3;background:#fff}

/* Mobile: keep the same visual language, use compact cards + bottom nav */
@media (max-width:780px){
  .app-shell{padding-left:0}
  .sidebar{transform:translateX(-102%);width:245px}
  .sidebar.open{transform:translateX(0)}
  .topbar{height:64px;padding:0 15px;position:sticky}
  .mobile-menu{display:grid!important;width:38px;height:38px;border:0;border-radius:10px;background:#eaf5ff;color:#0872d8;place-items:center}
  .mobile-menu i{width:20px;height:20px}
  .profile-meta{display:none}
  .profile-button>i{display:none}
  .page{padding:20px 14px 82px}
  .page-heading{display:block;margin-bottom:13px}
  .page-heading h1{font-size:23px}
  .page-heading p{font-size:10px}
  .heading-actions{display:grid;grid-template-columns:1fr 1fr;margin-top:11px}
  .button{min-height:38px;font-size:10px}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .stat-card{min-height:98px}
  .dashboard-grid{grid-template-columns:1fr}
  .sales-chart-panel{min-height:250px}
  .chart-wrap{height:175px}
  .owner-grid,.counter-grid{grid-template-columns:1fr}
  .counter-summary{grid-template-columns:1fr}
  .trip-layout{grid-template-columns:1fr}
  .trip-table{overflow:auto}
  .trip-row{grid-template-columns:55px minmax(135px,1fr) auto;min-width:420px}
  .trip-info{display:none}
  .sales-workspace{grid-template-columns:1fr;gap:9px}
  .sales-left,.sales-center,.sales-right{position:static}
  .sales-left{order:1}
  .sales-center{order:2}
  .sales-right{order:3}
  .sales-progress{display:none}
  .bus-seat-wrap{width:min(100%,330px)}
  .seat-grid{gap:7px}
  .seat-button{min-height:33px;font-size:8.5px}
  .ticket-modal-card{width:calc(100vw - 24px)}
  .bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:45;height:62px;display:grid;grid-template-columns:repeat(5,1fr);padding:5px 5px calc(5px + env(safe-area-inset-bottom));border-top:1px solid #dce6ef;background:rgba(255,255,255,.97);box-shadow:0 -8px 25px rgba(30,70,105,.08)}
  .bottom-nav button{border:0;background:transparent;color:#9aa6b4;font-size:8px}
  .bottom-nav button.active{color:#0872d8}
  .bottom-nav button.active i{background:#eaf5ff}
}
@media (max-width:420px){
  .page{padding-left:11px;padding-right:11px}
  .topbar{padding:0 11px}
  .breadcrumb span{display:none}
  .stats-grid{gap:7px}
  .stat-card{padding:11px}
  .stat-card strong{font-size:16px}
  .heading-actions{gap:7px}
}


/* ============================================================
   JatraBD v13 — live login cleanup
   Fixes the remaining legacy purple login/access styles seen on
   mobile production. Visual-only; IDs, JS and data flow unchanged.
   ============================================================ */
.login-screen{
  background:#f5f9fd!important;
}
.jpl-stage{
  border-color:#d8e7f2!important;
  box-shadow:0 18px 50px rgba(20,76,120,.12)!important;
}
.jpl-hero{
  background:
    radial-gradient(circle at 78% 6%,rgba(108,194,255,.28),transparent 26%),
    radial-gradient(circle at 5% 97%,rgba(8,92,166,.40),transparent 35%),
    linear-gradient(160deg,#0666b6 0%,#0b8de9 52%,#07569d 100%)!important;
}
.jpl-brand-copy small{color:#d7efff!important}
.jpl-live-badge{
  border-color:rgba(255,255,255,.24)!important;
  color:#f1f9ff!important;
  background:rgba(255,255,255,.11)!important;
}
.jpl-hero-kicker{color:#d8efff!important}
.jpl-hero-copy p{color:#e0f3ff!important}
.jpl-hero-cta{color:#086cc0!important;background:#fff!important}
.jpl-hero-cta:hover{background:#f1f9ff!important}
.jpl-ticket-float{
  border-color:rgba(255,255,255,.24)!important;
  background:rgba(4,62,112,.68)!important;
}
.jpl-ticket-float > i{color:#0872d8!important}
.jpl-ticket-float small{color:#d9efff!important}
.jpl-seat-float{background:rgba(255,255,255,.14)!important}
.jpl-seat-float small{color:#dcefff!important}
.jpl-hero-benefits{color:#dcefff!important}

.jpl-access-label{color:#476b88!important}
.jpl-lang{
  border-color:#d7e6f1!important;
  color:#315d7d!important;
  background:#fbfdff!important;
}
.jpl-welcome h2{color:#173957!important}
.jpl-welcome p{color:#70879a!important}
.jpl-role-switch{
  border-color:#dce8f1!important;
  background:#f5f9fc!important;
}
.jpl-role-choice{color:#71879a!important}
.jpl-role-choice:hover{
  color:#0872d8!important;
  background:#edf7ff!important;
}
.jpl-role-choice.active{
  color:#0872d8!important;
  background:#eaf5ff!important;
  box-shadow:0 5px 12px rgba(11,123,234,.14)!important;
}

.jpl-login{
  border-color:#d9e7f1!important;
  background:#fff!important;
  box-shadow:0 7px 20px rgba(25,70,110,.05)!important;
}
.jpl-login-icon{
  color:#fff!important;
  background:linear-gradient(135deg,#1594f5,#0872db)!important;
  box-shadow:0 8px 17px rgba(11,123,234,.18)!important;
}
.jpl-login-head h2{color:#173957!important}
.jpl-login-head p{color:#71879a!important}
.jpl-demo-hint{
  border-color:#d8e9f5!important;
  color:#476b88!important;
  background:#f2f8fd!important;
}
.jpl-demo-hint code{color:#075da8!important}
.jpl-demo-chip{
  color:#fff!important;
  background:linear-gradient(135deg,#1594f5,#0872db)!important;
  box-shadow:0 3px 8px rgba(11,123,234,.18)!important;
}
.jpl-field{color:#3e5870!important}
.jpl-input{border-color:#dbe5ed!important}
.jpl-input:focus-within{
  border-color:#73b8eb!important;
  box-shadow:0 0 0 4px rgba(11,131,232,.10)!important;
}
.jpl-input > i{color:#91a3b2!important}
.jpl-input input::placeholder{color:#9aaab7!important}
.jpl-eye{color:#8ea2b2!important}
.jpl-check{color:#667d90!important}
.jpl-check input{accent-color:#0872d8!important}
.jpl-submit{
  background:linear-gradient(135deg,#1594f5,#0872db)!important;
  box-shadow:0 10px 21px rgba(8,114,219,.20)!important;
}
.jpl-submit:hover{box-shadow:0 14px 26px rgba(8,114,219,.26)!important}

.jpl-other-label{color:#71879a!important}
.jpl-acc,.jpl-super{
  border-color:#d9e7f1!important;
  background:#fff!important;
}
.jpl-acc.open,.jpl-super.open{
  border-color:#c5deee!important;
  box-shadow:0 8px 18px rgba(25,70,110,.07)!important;
}
.jpl-acc-head:hover{background:#f8fbfe!important}
.jpl-acc-icon{
  color:#0872d8!important;
  background:#eaf5ff!important;
}
.jpl-acc-title strong{color:#294861!important}
.jpl-acc-title small{color:#8294a3!important}
.jpl-acc-chevron{color:#8da1b0!important}
.jpl-acc-panel p{color:#60788c!important}
.jpl-acc-cta{
  color:#0872d8!important;
  border-color:#cfe3f2!important;
  background:#f5faff!important;
}
.jpl-acc-cta:hover{background:#eaf5ff!important}
.jpl-super-head .jpl-lock-mini{
  color:#0872d8!important;
  background:#eaf5ff!important;
}
.jpl-heart{color:#0872d8!important}
.jpl-footer p{color:#8294a3!important}

@media (max-width:760px){
  .jpl-hero{min-height:445px!important}
  .jpl-access{padding:21px 16px 19px!important}
  .jpl-welcome h2{font-size:23px!important}
  .jpl-login{border-radius:14px!important}
}


/* ===== JatraBD Reference v14 — full A-to-Z visual redesign ===== */
:root{--r-blue:#1687e8;--r-blue2:#0872d8;--r-navy:#062b4d;--r-ink:#10243a;--r-muted:#748798;--r-line:#dce8f1;--r-bg:#f5f9fd;--r-green:#12a66a;--r-red:#ef6b70;--r-yellow:#f3c45b;--r-radius:8px;--r-shadow:0 4px 15px rgba(15,58,92,.07)}
html,body{font-family:var(--app-font);background:var(--r-bg);color:var(--r-ink)}
button,input,select,textarea{font-family:inherit}
body{background:var(--r-bg)}
/* LOGIN */
.login-screen{padding:24px;background:var(--r-bg);overflow:auto}
.jpl{width:min(1120px,100%);margin:auto}
.jpl-stage{display:grid!important;grid-template-columns:1.02fr .98fr;min-height:690px;background:#fff;border:1px solid var(--r-line);border-radius:12px;overflow:hidden;box-shadow:0 12px 35px rgba(18,64,99,.1)}
.jpl-hero{min-height:690px;padding:28px 32px;background:linear-gradient(155deg,#0b80dc,#0a5fa9 62%,#073f70);color:#fff;position:relative;overflow:hidden}
.jpl-hero-grid{display:none}.jpl-brand-copy small{display:none}.jpl-brand-copy strong{font-size:23px}
.jpl-hero-content{margin-top:105px;position:relative;z-index:3}.jpl-live-badge,.jpl-hero-kicker,.jpl-hero-cta{display:none}
.jpl-hero-copy h1{font-size:38px;line-height:1.12;margin:0 0 10px}.jpl-hero-copy p{font-size:15px;color:rgba(255,255,255,.85);max-width:390px}
.jpl-terminal-visual{position:absolute;left:25px;right:20px;bottom:34px;height:300px;display:flex;justify-content:center;align-items:flex-end}
.jpl-journey-art{width:min(520px,100%);filter:drop-shadow(0 16px 22px rgba(0,20,45,.28))}
.jpl-ticket-float,.jpl-seat-float,.jpl-hero-icon{display:none}
.jpl-hero-benefits{position:absolute;left:32px;right:32px;bottom:20px;display:flex;gap:18px;color:rgba(255,255,255,.8);font-size:10px}
.jpl-access{padding:34px 42px;background:#fff;overflow:auto}
.jpl-access-top{justify-content:flex-end}.jpl-access-label{display:none}
.jpl-welcome{margin:48px 0 20px}.jpl-welcome h2{font-size:26px;margin-bottom:6px}.jpl-welcome p{font-size:13px;color:var(--r-muted)}
.jpl-role-switch{gap:6px;border-bottom:1px solid var(--r-line);padding-bottom:7px}
.jpl-role-choice{background:#fff;color:var(--r-muted);border:0;border-radius:6px;padding:9px 6px;font-size:11px}
.jpl-role-choice.active{background:#edf7ff;color:var(--r-blue);box-shadow:inset 0 -2px var(--r-blue)}
.jpl-login{border:0;background:transparent;box-shadow:none;padding:0}
.jpl-login-head{margin-bottom:16px}.jpl-login-icon{width:34px;height:34px;background:#eaf5ff;color:var(--r-blue);border-radius:8px}.jpl-login-head h2{font-size:16px}.jpl-login-head p{font-size:10px;color:var(--r-muted)}
.jpl-demo-hint{display:none}.jpl-form{gap:12px}.jpl-field{font-size:10px;gap:6px}.jpl-input{height:42px;border:1px solid var(--r-line);border-radius:6px}.jpl-input:focus-within{border-color:var(--r-blue);box-shadow:0 0 0 3px rgba(22,135,232,.08)}
.jpl-input input{font-size:12px}.jpl-submit{height:42px;border-radius:6px;background:var(--r-blue);box-shadow:0 5px 12px rgba(22,135,232,.2);font-size:12px}
.jpl-other-portals{margin-top:20px}.jpl-other-label{font-size:9px;color:#8d9ba8}.jpl-acc,.jpl-super{border:1px solid var(--r-line);border-radius:7px}.jpl-acc-head{padding:10px}.jpl-acc-icon{background:#f1f7fc;color:var(--r-blue)}
.jpl-acc-title strong{font-size:11px}.jpl-acc-title small{font-size:9px;color:var(--r-muted)}.jpl-acc-panel{font-size:10px;color:var(--r-muted)}
.jpl-footer{font-size:9px;color:#9aa8b5}.jpl-heart{color:var(--r-blue)}.jpl-support{display:none}
/* APP SHELL */
.app-shell{grid-template-columns:210px minmax(0,1fr);background:var(--r-bg)}
.sidebar{background:var(--r-navy);padding:16px 10px 12px;border-right:1px solid #073b63}
.brand{padding:5px 9px 18px}.brand-mark{color:var(--r-blue)}.brand>span:last-child strong{font-size:17px}.brand>span:last-child small{font-size:8px;color:#8fb0c9}
.account-card{padding:13px 8px}.account-card strong{font-size:10px}.account-card span{font-size:8px;color:#7fa0b8}
.nav-menu{padding-top:14px;gap:3px}.nav-label{font-size:8px;color:#6e94ae}.nav-item{padding:8px 9px;border-radius:6px;color:#b9cfdf;font-size:10px}.nav-item.active{background:var(--r-blue);box-shadow:0 4px 10px rgba(22,135,232,.25)}
.main-content{background:var(--r-bg)}.topbar{height:58px;padding:0 25px;background:#fff;border-bottom:1px solid var(--r-line)}
.breadcrumb{font-size:10px}.breadcrumb strong{font-size:11px;color:#1a3147}.profile-meta strong{font-size:9px}.profile-meta small{font-size:8px}
.page{padding:22px 25px 42px;max-width:1360px}.page-heading{margin-bottom:17px}.page-heading h1{font-size:22px;color:#12283d}.page-heading p{font-size:11px;color:#7b8b9b}.eyebrow{font-size:8px!important;color:var(--r-blue)!important}
.button{min-height:34px;border-radius:5px;background:var(--r-blue);border-color:var(--r-blue);font-size:10px;box-shadow:0 4px 9px rgba(22,135,232,.16)}.button--secondary{background:#fff;color:var(--r-blue);box-shadow:none}.button--ghost{background:#fff;border-color:var(--r-line);color:#5f7385;box-shadow:none}
.panel{border:1px solid var(--r-line);border-radius:8px;box-shadow:var(--r-shadow)}.panel-heading{padding:13px 14px;border-bottom:1px solid #edf2f6}.panel-heading h2{font-size:12px}.panel-heading p{font-size:9px}
.local-data-note{font-size:9px;background:#eef7fd;border-color:#d8ebf8;border-radius:5px}
/* DASHBOARD / HOME */
.counter-portal-shortcut{display:none}
.hero-banner{min-height:215px;border-radius:9px;background:linear-gradient(115deg,#0a70c6,#0d94ed 58%,#c9eaff);padding:25px 30px;box-shadow:0 8px 20px rgba(22,135,232,.15);grid-template-columns:1.05fr .95fr}
.hero-copy h2{font-size:25px;line-height:1.18}.hero-copy>p{font-size:10px!important;color:rgba(255,255,255,.82)!important}.hero-chip{font-size:8px}.hero-stats{gap:25px}.hero-stats strong{font-size:15px}.hero-stats small{font-size:8px}.hero-actions{gap:6px}
.hero-art{height:190px}.hero-art stop:first-child{stop-color:#fff!important}.hero-art stop:last-child{stop-color:#0b61ad!important}.hero-road{stroke:rgba(255,255,255,.55)!important}.hero-orbit{stroke:rgba(255,255,255,.25)!important}
.quick-actions{grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:15px}.quick-action{border:1px solid var(--r-line);border-radius:7px;padding:10px;background:#fff}.qa-purple{background:#eaf5ff;color:var(--r-blue)}
.stats-grid{grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:15px}.stat-card{border:1px solid var(--r-line);border-radius:8px;padding:13px;box-shadow:var(--r-shadow)}.stat-card>small{font-size:8px}.stat-value-row strong{font-size:20px}
.dashboard-grid{grid-template-columns:1.55fr 1fr;gap:12px}.chart-wrap{height:195px}.chart-line{stroke:var(--r-blue)}.departures-panel,.recent-panel{margin-bottom:12px}
.departure-card{grid-template-columns:75px 1.3fr 1fr auto;gap:15px;padding:11px 0}.dep-bar{height:4px}.dep-bar i{background:var(--r-blue)}
.status{border-radius:4px;font-size:7px}.status--success{background:#e7f8ef;color:#0a9b61}.status--danger{background:#ffebed;color:#d64d58}.status--due{background:#fff4df;color:#bf7b12}
/* MANAGEMENT */
.owner-grid,.counter-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.owner-card,.counter-card{border:1px solid var(--r-line);border-radius:8px;padding:13px;box-shadow:var(--r-shadow)}
.owner-card h2,.counter-card h2{font-size:11px}.owner-card p,.counter-card p{font-size:8px;color:#8494a2}.owner-contact,.counter-card-detail{border-color:#edf2f6}
.counter-summary{grid-template-columns:repeat(3,1fr);gap:10px}.counter-summary>div{border:1px solid var(--r-line);border-radius:7px;padding:12px}.counter-summary strong{font-size:16px}
.trip-layout{grid-template-columns:minmax(0,1.5fr) 290px;gap:12px}.trip-row{grid-template-columns:78px 1.5fr 100px 70px 90px 90px;padding:11px 14px;border-bottom:1px solid #edf2f6}.trip-info{padding:16px;border-radius:8px}.trip-info h2{font-size:15px}
/* SALES / SEARCH / SEATS / PAYMENT */
.sales-workspace{grid-template-columns:250px minmax(350px,1fr) 275px;gap:10px}.sales-left,.sales-center,.sales-right{border-radius:8px}
.trip-search-form,.booking-form{padding:13px;gap:9px}.trip-search-form label,.booking-fields label{font-size:8px}.trip-search-form select,.trip-search-form input,.booking-fields input,.booking-fields select{height:34px;border:1px solid var(--r-line);border-radius:5px;font-size:9px}
.sales-trip-list{padding:7px}.sales-trip-card{border:1px solid #e3ebf2;border-radius:7px;padding:9px;margin-bottom:7px}.sales-trip-card.active,.sales-trip-card:hover{border-color:#8dc9f5;background:#f5fbff}
.sales-trip-card-top strong{font-size:11px}.sales-trip-card p{font-size:9px}.sales-trip-route{font-size:8px}.sales-trip-meta,.fare-rule{font-size:7px}.sales-trip-card-bottom b{font-size:11px}
.sales-center{min-height:590px}.seat-count{background:#eef7fd;color:var(--r-blue);font-size:8px}.seat-legend{font-size:7px}.seat-icon{width:11px;height:11px}.bus-seat-wrap{width:min(315px,88%);padding:18px 25px 22px;border:1px solid #dbe6ee;border-radius:42px 42px 15px 15px;background:linear-gradient(#fff,#f8fbfd)}
.seat-grid{gap:7px}.seat-button{width:30px;height:28px;border:1px solid #8fc8ed;border-radius:4px;background:#dff1fc;color:#1973b5;font-size:8px}.seat-button.selected{background:var(--r-blue);border-color:var(--r-blue);color:#fff}.seat-button.booked{background:#ffd9da;color:#cf5960;border-color:#f2aaad}.seat-button.blocked{background:#edf1f4;color:#aab5bd;border-color:#d8e0e5}
.selected-seat-summary{margin:13px;border:1px solid #dbe7ef;background:#f8fbfd;border-radius:6px}.selected-seat-summary>div{padding:9px}.selected-seat-summary small{font-size:7px}.selected-seat-summary strong{font-size:10px}
.fare-policy{background:#eef8ff;border-color:#d5ecfb;border-radius:5px;padding:8px;font-size:7px}.payment-note{padding:8px;background:#f8fafc;border-radius:5px;font-size:7px}
.sales-progress span{width:22px;height:22px}.sales-progress span.active{background:var(--r-blue);border-color:var(--r-blue)}.sales-progress i{background:#d6e2eb}
/* REPORTS / SETTINGS */
.report-cards{grid-template-columns:repeat(3,1fr);gap:10px}.report-card{border:1px solid var(--r-line);border-radius:8px;padding:14px}.report-card strong{font-size:19px}.report-grid{grid-template-columns:1.4fr 1fr;gap:12px}.settings-grid{grid-template-columns:1fr 1fr;gap:12px}.settings-grid article{padding:14px}.support-grid{grid-template-columns:repeat(3,1fr);gap:10px}.support-card{border:1px solid var(--r-line);border-radius:8px;padding:16px}
/* MODALS / TICKET */
.modal{background:rgba(4,29,50,.48);backdrop-filter:blur(2px)}.modal-card{border:1px solid #dce7ef;border-radius:10px;box-shadow:0 20px 60px rgba(4,30,51,.2)}.ticket-modal-card{padding:20px}.ticket-success>span{background:var(--r-green)}.ticket-preview{border:1px solid var(--r-line);border-radius:8px}.confirmation-badge{background:#e8f8f0;color:#0a9c61}.toast{background:var(--r-navy)}
/* RESPONSIVE */
.bottom-nav{display:none}
@media(max-width:1100px){.sales-workspace{grid-template-columns:225px minmax(300px,1fr)}.sales-right{grid-column:1/-1}.trip-layout{grid-template-columns:1fr}.trip-info{position:static}}
@media(max-width:800px){
 .login-screen{padding:0}.jpl-stage{display:block!important;border-radius:0;min-height:100vh}.jpl-hero{min-height:260px;padding:20px}.jpl-hero-content{margin-top:45px}.jpl-hero-copy h1{font-size:27px}.jpl-terminal-visual{height:145px;bottom:0}.jpl-hero-benefits{display:none}.jpl-access{padding:22px 20px 28px}
 .app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:0;top:0;bottom:0;width:245px;height:100vh;transform:translateX(-105%);transition:transform .2s;box-shadow:8px 0 25px rgba(0,0,0,.15)}body.menu-open .sidebar{transform:translateX(0)}
 .topbar{height:54px;padding:0 14px}.mobile-menu{display:grid}.profile-meta{display:none}.page{padding:16px 13px 30px}.page-heading{align-items:flex-start;flex-direction:column}.heading-actions{width:100%}.heading-actions .button{flex:1}
 .hero-banner{grid-template-columns:1fr;min-height:300px;padding:20px}.hero-art{position:absolute;right:-35px;bottom:-5px;width:62%;opacity:.72}.quick-actions{grid-template-columns:1fr 1fr}.stats-grid{grid-template-columns:1fr 1fr}.dashboard-grid,.report-grid{grid-template-columns:1fr}.owner-grid,.counter-grid,.support-grid,.settings-grid{grid-template-columns:1fr}.settings-grid article:first-child{grid-column:auto}.counter-summary,.report-cards{grid-template-columns:1fr}
 .sales-workspace{grid-template-columns:1fr}.sales-left,.sales-center,.sales-right{grid-column:auto}.trip-row{grid-template-columns:1fr 1fr}.trip-row>div:nth-child(4),.trip-row>div:nth-child(5){display:none}.departure-card{grid-template-columns:60px 1fr}.dep-seats,.dep-foot{grid-column:2}.ticket-actions{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){.quick-actions{grid-template-columns:1fr}.hero-copy h2{font-size:21px}.hero-actions{display:grid}.hero-actions .button{width:100%}.sales-center{min-height:500px}.seat-grid{gap:6px}.seat-button{width:27px;height:26px}.bus-seat-wrap{width:100%;padding-left:18px;padding-right:18px}.selected-seat-summary{grid-template-columns:1fr}.selected-seat-summary>div{border-right:0;border-bottom:1px solid #e4edf2}.jpl-role-choice span{font-size:9px}}
body:not(.authenticated) .app-shell,body:not(.authenticated) .bottom-nav{display:none!important}
body.authenticated .login-screen{display:none!important}

/* ============================================================
   JatraBD v15 — supplied-reference visual reconstruction
   This layer changes presentation/layout, not business logic.
   ============================================================ */
:root{
  --brand:#1687e8!important;
  --brand-dark:#0867bd!important;
  --brand-soft:#eaf5ff!important;
  --navy:#062d52!important;
  --ink:#12263d!important;
  --muted:#6f8194!important;
  --line:#e3ebf2!important;
  --paper:#fff!important;
  --canvas:#f7fafd!important;
  --green:#14a66a!important;
  --green-soft:#e9faf3!important;
  --red:#ed6a6a!important;
  --orange:#f2b84b!important;
  --radius:7px!important;
  --shadow:0 3px 14px rgba(16,45,75,.07)!important;
}
body{background:#f7fafd!important;color:#12263d!important;}
body:not(.authenticated) .app-shell,
body:not(.authenticated) .bottom-nav{display:none!important;}
body:not(.authenticated) .public-home{display:block;}
.public-home{min-height:100vh;background:#fff;}
.public-home[hidden]{display:none!important;}
.public-header{height:64px;max-width:1280px;margin:auto;padding:0 22px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #edf2f6;background:#fff;}
.public-brand{display:flex;align-items:center;gap:7px;color:#0c2946;text-decoration:none;font-size:19px;font-weight:800;letter-spacing:-.6px;}
.public-brand-mark{width:25px;height:25px;border-radius:7px 7px 9px 4px;display:grid;place-items:center;color:#fff;background:#1687e8;font-size:15px;font-weight:900;transform:skew(-7deg);}
.public-nav{display:flex;gap:30px;align-items:center;margin-left:auto;margin-right:25px;}
.public-nav a{font-size:11px;color:#718398;text-decoration:none;font-weight:600;}
.public-nav a:hover{color:#1687e8;}
.public-login-button{border:0;border-radius:5px;padding:8px 19px;color:#fff;background:#1687e8;font-size:11px;font-weight:700;box-shadow:0 4px 10px rgba(22,135,232,.18);}
.public-hero{position:relative;max-width:1280px;margin:0 auto;padding:24px 22px 80px;min-height:430px;background:#fff;overflow:hidden;}
.public-hero-photo{height:280px;border-radius:2px;position:relative;overflow:hidden;background:linear-gradient(180deg,#1687e8 0%,#5ab6ee 49%,#d8f0fb 50%,#87b875 68%,#315f3c 100%);box-shadow:0 2px 10px rgba(15,54,88,.12);}
.public-sky{position:absolute;inset:0;background:radial-gradient(circle at 70% 30%,rgba(255,255,255,.55),transparent 23%),linear-gradient(160deg,rgba(255,255,255,.08),rgba(0,52,90,.18));}
.public-road{position:absolute;left:-5%;right:-5%;bottom:-56px;height:135px;border-radius:50% 50% 0 0;background:linear-gradient(170deg,#425866,#172a35);transform:rotate(-5deg);}
.public-bus-art{position:absolute;right:9%;bottom:26px;width:300px;height:180px;transform:skewY(-1deg);filter:drop-shadow(0 18px 15px rgba(0,0,0,.2));}
.bus-body{position:absolute;left:26px;right:18px;bottom:28px;height:105px;border-radius:24px 30px 12px 12px;background:linear-gradient(180deg,#eef8ff,#b9e1f7);border:3px solid #0b5b93;}
.bus-window{position:absolute;z-index:2;left:45px;right:40px;top:27px;height:51px;display:grid;grid-template-columns:repeat(3,1fr);gap:5px;}
.bus-window span{border-radius:6px;background:linear-gradient(145deg,#0a5d91,#1b9be3);border:2px solid #d6f2ff;}
.bus-wheel{position:absolute;z-index:3;bottom:6px;width:37px;height:37px;border-radius:50%;background:#102638;border:7px solid #93aec0;}
.bus-wheel-a{left:59px}.bus-wheel-b{right:47px}
.public-tree{position:absolute;bottom:42px;width:32px;height:72px;border-radius:50% 50% 45% 45%;background:#285a39;box-shadow:10px 7px 0 #356f43;}
.public-tree:after{content:"";position:absolute;left:13px;bottom:-30px;width:7px;height:38px;background:#5a4933;}
.t1{left:8%;transform:scale(1.15)}.t2{left:19%;bottom:58px;transform:scale(.8)}.t3{right:3%;bottom:48px;transform:scale(.9)}
.public-hero-copy{position:absolute;left:50px;top:73px;color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.25);z-index:4;}
.public-kicker{font-size:10px;font-weight:700;letter-spacing:.3px;opacity:.9;}
.public-hero-copy h1{font-size:29px;line-height:1.08;margin:7px 0 8px;font-weight:700;letter-spacing:-.8px;}
.public-hero-copy h1 strong{font-weight:800;}
.public-hero-copy p{font-size:11px;line-height:1.5;margin:0;max-width:260px;}
.public-search{position:absolute;z-index:8;left:38px;right:38px;bottom:22px;display:grid;grid-template-columns:1.05fr 1.05fr 1fr auto;gap:9px;padding:13px;border:1px solid #e5edf4;border-radius:8px;background:#fff;box-shadow:0 10px 30px rgba(20,54,88,.12);}
.public-search label{display:flex;flex-direction:column;gap:5px;padding:0 8px;border-right:1px solid #edf1f5;}
.public-search label span{font-size:8px;color:#8291a1;font-weight:700;}
.public-search select,.public-search input{border:0;outline:0;color:#243b51;background:#fff;font-size:10px;font-weight:600;min-height:23px;}
.public-search button{min-width:105px;border:0;border-radius:5px;background:#1687e8;color:#fff;font-size:10px;font-weight:700;}
.public-popular{max-width:1280px;margin:0 auto;padding:0 22px 28px;}
.public-section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.public-section-title h2{font-size:15px;margin:0;color:#162c43;}
.public-section-title a{font-size:9px;color:#1687e8;text-decoration:none;}
.public-route-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.public-route-grid article{border:1px solid #e3ebf2;border-radius:7px;padding:12px 11px;background:#fff;box-shadow:0 2px 8px rgba(24,55,84,.035);}
.public-route-grid span{display:block;font-size:10px;color:#52677c;font-weight:600;margin-bottom:8px;}
.public-route-grid strong{font-size:11px;color:#0f2942;}
.public-info-strip{max-width:1280px;margin:0 auto;padding:0 22px 30px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.public-info-strip div{padding:14px;border:1px solid #e3ebf2;border-radius:7px;background:#fbfdff;}
.public-info-strip strong,.public-info-strip span{display:block}.public-info-strip strong{font-size:11px}.public-info-strip span{margin-top:4px;font-size:9px;color:#7c8c9b;}

body.login-open .public-home{display:none!important;}
body:not(.login-open):not(.authenticated) .login-screen{display:none!important;}
body.login-open .login-screen{display:block!important;}
body.login-open{overflow:hidden;}
body.login-open .app-shell{display:none!important;}

/* Reference screen #8: compact white/blue login, not the old purple portal. */
.login-screen{background:#f7fafd!important;}
.jpl{width:min(100%,1050px)!important;padding:22px!important;}
.jpl-stage{grid-template-columns:42% 58%!important;min-height:650px!important;border:1px solid #e0eaf2!important;border-radius:8px!important;box-shadow:0 8px 30px rgba(15,49,78,.10)!important;}
.jpl-hero{min-height:650px!important;padding:34px 30px 24px!important;background:linear-gradient(180deg,#1586e8 0%,#0c5eab 100%)!important;}
.jpl-hero::before,.jpl-hero::after{display:none!important;}
.jpl-hero-grid{opacity:.08!important;}
.jpl-hero-content{margin-top:auto!important;margin-bottom:auto!important;}
.jpl-hero-content h1{font-size:28px!important;line-height:1.15!important;}
.jpl-terminal-visual{margin-top:12px!important;}
.jpl-ticket-float,.jpl-seat-float,.jpl-hero-benefits,.jpl-live-badge,.jpl-hero-kicker{display:none!important;}
.jpl-access{padding:38px 40px!important;background:#fff!important;}
.jpl-welcome h2{font-size:20px!important;color:#152d44!important;}
.jpl-role-switch{border:1px solid #e0eaf2!important;background:#f7fafd!important;}
.jpl-role-choice.active{background:#eaf5ff!important;color:#1687e8!important;}
.jpl-login{border:1px solid #e1eaf1!important;box-shadow:none!important;border-radius:7px!important;}
.jpl-login-icon{color:#1687e8!important;background:#eaf5ff!important;}
.jpl-submit,.jpl-hero-cta{background:#1687e8!important;border-color:#1687e8!important;box-shadow:none!important;}
.jpl-demo-hint{background:#f5f9fc!important;border-color:#e1eaf1!important;}
.jpl-acc{border-color:#e1eaf1!important;}
.jpl-super{border-color:#e1eaf1!important;}
.jpl-footer{color:#8a98a7!important;}

/* Authenticated shell: match screens #9–#12 proportions. */
.app-shell{padding-left:185px!important;}
.sidebar{width:185px!important;padding:15px 10px 12px!important;background:#062d52!important;}
.brand{padding:3px 8px 18px!important}.brand-mark{width:31px!important;height:31px!important;border-radius:7px!important;background:#1687e8!important}.brand strong{font-size:16px!important}.brand small{font-size:8px!important}
.account-card{padding:8px!important;margin:0 2px 12px!important;border-radius:7px!important}.account-card strong{font-size:10px!important}.account-card span{font-size:8px!important}
.nav-label{font-size:8px!important;margin:3px 8px 5px!important}.nav-item,.support-link{min-height:32px!important;padding:6px 8px!important;border-radius:6px!important;font-size:10px!important;gap:8px!important}.nav-item i,.support-link i{width:14px!important;height:14px!important}.nav-item.active{box-shadow:inset 2px 0 0 #1687e8!important;background:#1687e8!important}
.sidebar-bottom{padding-top:10px!important}.sidebar-bottom span{font-size:8px!important;padding:8px 8px 0!important}
.topbar{height:54px!important;padding:0 20px!important}.breadcrumb{font-size:10px!important}.topbar-end{gap:8px!important}.icon-button{width:30px!important;height:30px!important}.profile-meta strong{font-size:9px!important}.profile-meta small{font-size:8px!important}
.page{max-width:1180px!important;padding:20px 20px 32px!important}.page-heading{margin-bottom:15px!important}.page-heading h1{font-size:20px!important}.page-heading p{font-size:9px!important}.eyebrow{font-size:9px!important}
.button{min-height:32px!important;padding:6px 10px!important;border-radius:5px!important;font-size:9px!important;box-shadow:none!important;background:#1687e8!important;border-color:#1687e8!important}.button--secondary{color:#1687e8!important;background:#fff!important;border-color:#cfe4f5!important}
.panel{border-radius:7px!important;box-shadow:0 2px 9px rgba(17,49,78,.045)!important}.panel-heading{min-height:40px!important;padding:12px 14px 7px!important}.panel-heading h2{font-size:11px!important}.panel-heading p{font-size:8px!important}
.stats-grid{gap:9px!important;margin-bottom:10px!important}.stat-card{min-height:75px!important;padding:10px!important;border-radius:7px!important}.stat-icon{width:25px!important;height:25px!important;border-radius:6px!important}.stat-icon i{width:13px!important;height:13px!important}.stat-card small{margin-top:7px!important;font-size:8px!important}.stat-card strong{font-size:15px!important}.stat-card .delta{font-size:8px!important}
.hero-banner{padding:0!important;min-height:180px!important;border-radius:7px!important;background:linear-gradient(135deg,#1687e8,#075a9e)!important}.hero-copy{padding:18px!important}.hero-copy h2{font-size:21px!important}.hero-copy p{font-size:9px!important}.hero-art{max-width:42%!important}
.quick-actions{gap:8px!important;margin:10px 0!important}.quick-action{padding:10px!important;border-radius:7px!important}.quick-text strong{font-size:9px!important}.quick-text small{font-size:8px!important}
.dashboard-grid{gap:10px!important}.departures-panel{margin-top:10px!important}.recent-panel{margin-top:10px!important}
.sales-workspace{gap:10px!important}.sales-left,.sales-center,.sales-right{border-radius:7px!important}.trip-search-form,.booking-form{padding:12px!important}.seat-grid{gap:5px!important}.seat-button{width:28px!important;height:25px!important;border-radius:4px!important;font-size:8px!important}
.fare-policy{font-size:8px!important}.payment-note{font-size:8px!important}
body.authenticated .local-data-note{font-size:8px!important;padding:7px 9px!important}.counter-portal-shortcut{padding:9px!important;margin-bottom:9px!important;border-radius:7px!important}.counter-portal-shortcut-copy h2{font-size:12px!important}.counter-portal-shortcut-copy span{font-size:8px!important}
@media (max-width:800px){
  .public-header{height:54px;padding:0 14px}.public-nav{display:none}.public-brand{font-size:16px}.public-login-button{padding:7px 13px;font-size:10px}
  .public-hero{padding:12px 12px 80px;min-height:395px}.public-hero-photo{height:250px}.public-hero-copy{left:28px;top:44px}.public-hero-copy h1{font-size:24px}.public-hero-copy p{font-size:9px}.public-bus-art{right:-8%;bottom:18px;transform:scale(.75)}
  .public-search{left:18px;right:18px;bottom:14px;grid-template-columns:1fr 1fr;gap:6px;padding:9px}.public-search label:nth-child(2){border-right:0}.public-search button{grid-column:1/-1;height:34px}.public-route-grid{grid-template-columns:1fr 1fr}.public-info-strip{grid-template-columns:1fr}
  .jpl{padding:0!important}.jpl-stage{display:block!important;min-height:100vh!important;border:0!important;border-radius:0!important}.jpl-hero{display:none!important}.jpl-access{min-height:100vh!important;padding:28px 18px!important}.jpl-welcome{margin-bottom:18px!important}
  .app-shell{padding-left:0!important}.sidebar{transform:translateX(-100%);transition:transform .2s}.sidebar.open{transform:none}.topbar{padding:0 13px!important}.page{padding:15px 12px 85px!important}.bottom-nav{display:flex!important;position:fixed!important;left:0;right:0;bottom:0;z-index:40;height:58px;background:#fff;border-top:1px solid #e1e9f0;justify-content:space-around}.bottom-nav button{color:#728398!important}.bottom-nav button.active{color:#1687e8!important}.stats-grid{grid-template-columns:1fr 1fr!important}.dashboard-grid{grid-template-columns:1fr!important}.hero-banner{min-height:230px!important}.hero-art{display:none!important}.sales-workspace{grid-template-columns:1fr!important}.sales-center{order:1}.sales-left{order:2}.sales-right{order:3}.public-info-strip{padding-bottom:80px}
}

/* =========================================================
   JatraBD v16 — full reference UI. Structural replacement layer.
   ========================================================= */
.ref-app{min-height:100vh;background:#f7fafd;color:#16283d;font-family:var(--app-font)}
.ref-app[hidden]{display:none!important}
body.ref-runtime .public-home,body.ref-runtime .login-screen,body.ref-runtime .app-shell{display:none!important}
.ref-header{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;background:#fff;border-bottom:1px solid #e4ebf2;position:sticky;top:0;z-index:50}
.ref-logo{display:flex;align-items:center;gap:6px;color:#0c2b49;text-decoration:none;font-size:17px}
.ref-logo-mark{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#1687e8;color:#fff;font-weight:900;font-size:14px}
.ref-header nav{display:flex;gap:25px;align-items:center}
.ref-header nav button,.ref-account{border:0;background:transparent;color:#6b7c8f;font-size:9px;font-weight:700;padding:7px}
.ref-header nav button:hover,.ref-account:hover{color:#1687e8}
.ref-account{border:1px solid #dce7ef;border-radius:5px;color:#1687e8}
.ref-main{max-width:1120px;margin:0 auto}
.ref-screen{padding:18px 18px 35px}
.ref-screen[hidden]{display:none!important}
.ref-home-hero{position:relative;padding-bottom:64px}
.ref-home-photo{height:335px;position:relative;overflow:hidden;border-radius:3px;background:linear-gradient(180deg,#1687e8 0,#54b5ea 46%,#9cc98a 47%,#315b39 100%)}
.ref-photo-overlay{position:absolute;inset:0;background:radial-gradient(circle at 75% 25%,rgba(255,255,255,.45),transparent 20%),linear-gradient(115deg,rgba(0,35,65,.18),rgba(0,0,0,.12))}
.ref-road{position:absolute;left:-8%;right:-5%;bottom:-75px;height:145px;background:#344c56;border-radius:50% 50% 0 0;transform:rotate(-7deg)}
.ref-bus{position:absolute;right:7%;bottom:34px;width:315px;height:195px;filter:drop-shadow(0 15px 12px rgba(0,0,0,.25))}
.ref-bus-body{position:absolute;left:35px;right:20px;bottom:28px;height:115px;border:3px solid #075d98;border-radius:27px 31px 13px 13px;background:linear-gradient(#f7fcff,#a9d9f4)}
.ref-bus-glass{position:absolute;z-index:2;left:54px;right:42px;top:35px;height:55px;display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.ref-bus-glass i{display:block;border:2px solid #d8f2ff;border-radius:6px;background:linear-gradient(145deg,#075b91,#1687e8)}
.ref-bus b{position:absolute;z-index:3;bottom:6px;width:42px;height:42px;border:7px solid #93aec0;border-radius:50%;background:#102638}
.ref-bus b:nth-of-type(1){left:65px}.ref-bus b:nth-of-type(2){right:50px}
.ref-copy{position:absolute;z-index:4;left:45px;top:63px;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.28)}
.ref-copy small{font-size:9px;font-weight:800}.ref-copy h1{font-size:28px;line-height:1.05;margin:7px 0;font-weight:600}.ref-copy h1 strong{font-weight:800}.ref-copy p{font-size:9px;max-width:245px;line-height:1.55}
.ref-search-card{position:absolute;z-index:10;left:22px;right:22px;bottom:18px;display:grid;grid-template-columns:1.1fr 1.1fr 1fr 105px;gap:7px;padding:12px;background:#fff;border:1px solid #e0e9f0;border-radius:7px;box-shadow:0 8px 25px rgba(17,50,78,.12)}
.ref-search-card label{padding:0 7px;border-right:1px solid #edf2f6}.ref-search-card small{display:block;color:#8b9aaa;font-size:7px;font-weight:800;margin-bottom:3px}.ref-search-card input,.ref-search-card select{width:100%;height:25px;border:0;outline:0;background:#fff;color:#24384e;font-size:9px;font-weight:600}
.ref-primary{border:0;border-radius:4px;background:#1687e8;color:#fff;min-height:31px;padding:6px 12px;font-size:9px;font-weight:800;box-shadow:0 4px 10px rgba(22,135,232,.14)}
.ref-outline{border:1px solid #d9e5ed;border-radius:4px;background:#fff;color:#1687e8;min-height:31px;padding:6px 11px;font-size:9px;font-weight:800}
.ref-section{padding:0 0 15px}.ref-title,.ref-page-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.ref-title h2{font-size:13px;margin:0}.ref-title button,.ref-link{border:0;background:none;color:#1687e8;font-size:8px;font-weight:700}.ref-route-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-top:9px}.ref-route-cards article{background:#fff;border:1px solid #e1eaf1;border-radius:6px;padding:10px}.ref-route-cards span,.ref-route-cards b{display:block}.ref-route-cards span{font-size:8px;color:#53677a}.ref-route-cards b{font-size:9px;margin-top:7px}
.ref-page-head{margin-bottom:14px}.ref-page-head small{font-size:8px;color:#1687e8;font-weight:800}.ref-page-head h1{font-size:19px;margin:2px 0;color:#152d44}.ref-page-head p{font-size:8px;color:#8090a0;margin:0}
.ref-search-results{display:grid;gap:9px;max-width:760px;margin:0 auto}.ref-result-card{display:grid;grid-template-columns:55px 1fr auto auto;gap:12px;align-items:center;padding:11px;border:1px solid #e1eaf1;border-radius:7px;background:#fff;box-shadow:0 2px 7px rgba(15,50,78,.04)}.ref-bus-thumb{width:55px;height:42px;border-radius:5px;background:linear-gradient(145deg,#0b74bd,#80c8f2);position:relative}.ref-bus-thumb:after{content:"";position:absolute;left:10px;right:10px;top:11px;height:16px;border-radius:3px;background:#dff4ff}.ref-result-card h3{font-size:10px;margin:0}.ref-result-card p{font-size:8px;color:#7c8b99;margin:3px 0}.ref-result-card strong{font-size:12px}.ref-result-card small{font-size:7px;color:#1687e8;background:#eaf5ff;border-radius:4px;padding:3px 5px}
.ref-seat-layout{display:grid;grid-template-columns:280px 1fr;gap:12px}.ref-trip-summary,.ref-seat-card,.ref-form-card,.ref-booking-summary,.ref-confirm-details,.ref-ticket-card{background:#fff;border:1px solid #e0e9f0;border-radius:7px;box-shadow:0 2px 9px rgba(17,50,78,.04)}.ref-trip-summary{padding:13px;height:max-content}.ref-trip-summary h3{font-size:11px;margin:0 0 5px}.ref-trip-summary p{font-size:8px;color:#718295;margin:3px 0}.ref-seat-card{padding:14px}.ref-seat-legend{display:flex;justify-content:flex-end;gap:12px;font-size:7px;color:#748699;margin-bottom:9px}.ref-seat-legend span{display:flex;align-items:center;gap:4px}.ref-seat-legend i{width:9px;height:9px;border-radius:2px;display:inline-block;background:#a9d9f5}.ref-seat-legend i.booked{background:#f2aaaa}.ref-seat-legend i.selected{background:#15a86a}.ref-bus-map{max-width:480px;margin:auto;border:1px solid #cddce6;border-radius:45% 45% 6px 6px;padding:20px 30px 22px;position:relative;min-height:310px;background:#fbfdff}.ref-driver{position:absolute;top:7px;left:50%;transform:translateX(-50%);font-size:7px;color:#7c8b98}.ref-seat-grid{display:grid;grid-template-columns:30px 30px 22px 30px 30px;gap:8px 7px;justify-content:center;margin-top:18px;align-items:center}.ref-seat-aisle{width:22px;height:22px;display:block}.ref-seat-grid button{width:25px;height:22px;border:1px solid #82c2ea;border-radius:3px;background:#b9e1f7;color:#075b92;font-size:7px}.ref-seat-grid button.booked{background:#f4b5b5;border-color:#ef9999;color:#a54c4c}.ref-seat-grid button.selected{background:#15a86a;border-color:#15a86a;color:#fff}.ref-seat-grid button.aisle{visibility:hidden;pointer-events:none}.ref-bottom-bar{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:11px;border-top:1px solid #edf2f6}.ref-bottom-bar small{display:block;font-size:7px;color:#8392a0}.ref-bottom-bar b{font-size:9px}.ref-bottom-bar strong{display:block;color:#1687e8;font-size:12px}
.ref-progress{display:flex;align-items:center;justify-content:center;max-width:500px;margin:0 auto 17px}.ref-progress b,.ref-progress span{width:14px;height:14px;border-radius:50%;display:grid;place-items:center;background:#1687e8;color:#fff;font-size:7px}.ref-progress span{background:#dce6ed;color:#9aa7b3}.ref-progress i{height:2px;flex:1;background:#1687e8}.ref-progress i:last-of-type{background:#dce6ed}
.ref-form-card{max-width:700px;margin:auto;padding:17px}.ref-form-card form{display:grid;gap:10px}.ref-form-card label{display:block;font-size:8px;font-weight:700;color:#354b60}.ref-form-card input,.ref-form-card select,.ref-form-card textarea{display:block;width:100%;margin-top:4px;border:1px solid #dfe8ee;border-radius:4px;padding:8px;font-size:9px;outline:0;background:#fff}.ref-form-card textarea{min-height:65px;resize:vertical}.ref-form-card fieldset{border:0;padding:0;margin:0;display:flex;gap:20px;font-size:8px}.ref-form-card fieldset label{font-weight:500}.ref-form-card fieldset input{display:inline;width:auto;margin:0}.ref-form-actions{display:flex;justify-content:flex-end;gap:7px;margin-top:5px}
.ref-payment-methods{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.ref-payment-methods button{border:1px solid #e0e9f0;border-radius:6px;background:#fff;padding:15px;text-align:left}.ref-payment-methods button.active{border-color:#1687e8;background:#eaf5ff}.ref-payment-methods strong,.ref-payment-methods small{display:block}.ref-payment-methods strong{font-size:11px}.ref-payment-methods small{font-size:7px;color:#7f8f9e;margin-top:4px}.ref-booking-summary{padding:12px;margin-top:10px}.ref-booking-summary h3{font-size:10px;margin:0 0 7px}.ref-booking-summary p{font-size:8px;color:#617487;margin:3px 0}.ref-confirm{max-width:540px;margin:35px auto;text-align:center;background:#fff;border:1px solid #e0e9f0;border-radius:7px;padding:28px}.ref-check{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;margin:auto;background:#14a66a;color:#fff;font-size:27px}.ref-confirm h1{font-size:17px;color:#14a66a;margin:10px 0 4px}.ref-confirm>p{font-size:8px;color:#718396}.ref-confirm-details{padding:13px;text-align:left;margin:15px 0}.ref-confirm-details div{display:flex;justify-content:space-between;font-size:8px;padding:4px 0}.ref-confirm-actions{display:flex;justify-content:center;gap:7px}
.ref-tabs{display:flex;gap:18px;border-bottom:1px solid #e2eaf0;margin-bottom:12px}.ref-tabs button{border:0;background:none;padding:8px 3px;font-size:8px;color:#81909e}.ref-tabs button.active{color:#1687e8;border-bottom:2px solid #1687e8}.ref-bookings-list{display:grid;gap:8px;max-width:760px;margin:auto}.ref-booking-card{display:grid;grid-template-columns:55px 1fr auto;gap:12px;padding:11px;border:1px solid #e0e9f0;border-radius:7px;background:#fff}.ref-booking-card h3{font-size:10px;margin:0}.ref-booking-card p{font-size:7px;color:#7b8c9c;margin:3px 0}.ref-booking-card .confirmed{color:#14a66a;background:#e8faf2;border-radius:4px;padding:3px 5px;font-size:7px;height:max-content}
.ref-admin-shell,.ref-counter-shell{min-height:calc(100vh - 58px);display:grid;grid-template-columns:165px 1fr;background:#f7fafd}.ref-admin-shell aside,.ref-counter-shell aside{background:#062d52;color:#dceaf5;padding:14px 9px;display:flex;flex-direction:column;gap:3px}.ref-admin-brand{display:flex;align-items:center;gap:6px;color:#fff;padding:2px 5px 15px;font-size:14px}.ref-admin-brand span{width:23px;height:23px;display:grid;place-items:center;background:#1687e8;border-radius:6px;font-weight:900}.ref-admin-shell aside button,.ref-counter-shell aside button{border:0;background:transparent;color:#b9cddd;text-align:left;border-radius:5px;padding:7px 8px;font-size:8px}.ref-admin-shell aside button.active,.ref-admin-shell aside button:hover,.ref-counter-shell aside button.active,.ref-counter-shell aside button:hover{background:#1687e8;color:#fff}.ref-admin-logout,.ref-counter-shell aside button:last-child{margin-top:auto}.ref-admin-content,.ref-counter-content{min-width:0}.ref-admin-top{height:46px;background:#fff;border-bottom:1px solid #e0e8ee;display:flex;align-items:center;justify-content:space-between;padding:0 17px;font-size:8px;color:#687b8e}.ref-admin-body,.ref-trip-admin,.ref-bus-form,.ref-counter-body{padding:18px;max-width:950px;margin:auto}.ref-admin-stats,.ref-counter-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}.ref-admin-stats div,.ref-counter-stats div{background:#fff;border:1px solid #e0e9f0;border-radius:6px;padding:10px}.ref-admin-stats small,.ref-admin-stats b,.ref-admin-stats span,.ref-counter-stats small,.ref-counter-stats b{display:block}.ref-admin-stats small,.ref-counter-stats small{font-size:7px;color:#81909d}.ref-admin-stats b,.ref-counter-stats b{font-size:14px;margin-top:5px}.ref-admin-stats span{font-size:7px;color:#14a66a}.ref-admin-panel,.ref-trip-row{background:#fff;border:1px solid #e0e9f0;border-radius:6px}.ref-admin-panel{padding:11px}.ref-admin-panel h2{font-size:10px;margin:0 0 8px}.ref-admin-trip{display:grid;grid-template-columns:55px 1fr 90px 70px;gap:10px;align-items:center;padding:9px 0;border-top:1px solid #edf2f6}.ref-admin-trip:first-child{border-top:0}.ref-admin-trip strong{font-size:8px}.ref-admin-trip span{font-size:7px;color:#718496}.ref-bus-form{max-width:650px}.ref-bus-form form{display:grid;grid-template-columns:1fr 1fr;gap:10px;background:#fff;border:1px solid #e0e9f0;border-radius:7px;padding:15px}.ref-bus-form label{font-size:8px;font-weight:700}.ref-bus-form input,.ref-bus-form select{width:100%;margin-top:4px;padding:8px;border:1px solid #dfe8ee;border-radius:4px;font-size:9px}.ref-bus-form .ref-form-actions{grid-column:1/-1}.ref-trip-admin{max-width:900px}.ref-trip-row{display:grid;grid-template-columns:60px 1.5fr 1fr 75px 70px;gap:10px;align-items:center;padding:10px;margin-bottom:7px}.ref-trip-row strong{font-size:8px}.ref-trip-row span{font-size:7px;color:#778a9b}
.ref-counter-stats{grid-template-columns:repeat(3,1fr)}.ref-counter-panel{max-width:720px;background:#fff;border:1px solid #e0e9f0;border-radius:7px;padding:13px}.ref-counter-panel h2{font-size:10px;margin:0 0 10px}.ref-quick-ticket{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ref-quick-ticket label{font-size:8px;font-weight:700}.ref-quick-ticket select,.ref-quick-ticket input{width:100%;margin-top:4px;border:1px solid #dfe8ee;border-radius:4px;padding:8px;font-size:9px}.ref-quick-ticket button{grid-column:1/-1}
.ref-ticket-page{max-width:760px;margin:auto}.ref-ticket-card{padding:15px}.ref-ticket-head{display:flex;justify-content:space-between;border-bottom:1px solid #e4ebf1;padding-bottom:12px}.ref-ticket-head strong{font-size:14px}.ref-ticket-head small{font-size:7px;color:#7b8b99}.ref-ticket-body{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.ref-ticket-box{padding:10px;border:1px solid #e7edf2;border-radius:5px}.ref-ticket-box small,.ref-ticket-box strong{display:block}.ref-ticket-box small{font-size:7px;color:#8795a2}.ref-ticket-box strong{font-size:9px;margin-top:3px}
@media(max-width:760px){
 .ref-header{padding:0 12px}.ref-header nav{gap:2px}.ref-header nav button{font-size:7px;padding:5px 3px}.ref-account{display:none}.ref-main{width:100%}.ref-screen{padding:12px 10px 25px}.ref-home-photo{height:310px}.ref-copy{left:25px;top:50px}.ref-copy h1{font-size:23px}.ref-bus{right:-18%;bottom:18px;transform:scale(.75)}.ref-search-card{left:12px;right:12px;bottom:11px;grid-template-columns:1fr 1fr}.ref-search-card label:nth-child(2){border-right:0}.ref-search-card button{grid-column:1/-1}.ref-route-cards{grid-template-columns:1fr 1fr}.ref-seat-layout{grid-template-columns:1fr}.ref-seat-card{order:1}.ref-trip-summary{order:2}.ref-bus-map{min-height:270px}.ref-result-card{grid-template-columns:45px 1fr auto}.ref-result-card small{display:none}.ref-form-card{padding:12px}.ref-payment-methods{grid-template-columns:1fr}.ref-admin-shell,.ref-counter-shell{grid-template-columns:1fr}.ref-admin-shell aside,.ref-counter-shell aside{position:sticky;top:0;z-index:10;display:grid;grid-template-columns:repeat(4,1fr);padding:5px}.ref-admin-brand{display:none}.ref-admin-shell aside button,.ref-counter-shell aside button{font-size:7px;text-align:center;padding:6px}.ref-admin-logout,.ref-counter-shell aside button:last-child{margin-top:0}.ref-admin-top{height:40px}.ref-admin-body,.ref-trip-admin,.ref-bus-form,.ref-counter-body{padding:11px}.ref-admin-stats{grid-template-columns:1fr 1fr}.ref-counter-stats{grid-template-columns:1fr 1fr 1fr}.ref-bus-form form{grid-template-columns:1fr}.ref-bus-form .ref-form-actions{grid-column:auto}.ref-trip-row{grid-template-columns:1fr 1fr}.ref-trip-row .ref-primary{grid-column:1/-1}.ref-ticket-body{grid-template-columns:1fr}
}

body.login-open .ref-app{display:none!important;}

/* JatraBD v17: the reference runtime is the only visible product UI.
   The legacy shell remains in source for business/data compatibility. */
body.ref-runtime .app-shell,
body.ref-runtime > .app-shell,
body.ref-runtime .app-shell *,
body.ref-runtime .sidebar,
body.ref-runtime .topbar { display:none !important; }
body:not(.login-open):not(.authenticated) .app-shell { display:none !important; }
body.login-open .ref-app { display:none !important; }
body.login-open .app-shell { display:none !important; }
#refApp { position:relative; z-index:100; width:100%; min-height:100vh; }
#refApp[hidden] { display:none !important; }
.ref-app .ref-screen[hidden] { display:none !important; }
.ref-app button { cursor:pointer; }

/* JatraBD v18 — unified English reference design */
body{font-family:var(--app-font);}
body.login-open{background:#f5f8fc;}
body.login-open .login-screen{display:block!important;position:fixed;inset:0;z-index:1000;background:#f5f8fc;overflow:auto;}
body.login-open .jpl{min-height:100vh;padding:0!important;}
body.login-open .jpl-stage{min-height:100vh;max-width:none!important;display:grid!important;grid-template-columns:minmax(42%,1fr) minmax(420px,560px)!important;background:#fff;border-radius:0!important;box-shadow:none!important;}
body.login-open .jpl-hero{min-height:100vh!important;border-radius:0!important;padding:64px clamp(28px,7vw,96px)!important;background:linear-gradient(135deg,#087bea 0%,#0754b8 100%)!important;color:#fff!important;display:flex;flex-direction:column;justify-content:center;}
body.login-open .jpl-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 75% 25%,rgba(255,255,255,.16),transparent 35%),linear-gradient(120deg,transparent 55%,rgba(255,255,255,.07));pointer-events:none;}
body.login-open .jpl-hero>*{position:relative;z-index:1;}
body.login-open .jpl-hero h1{font-size:clamp(34px,4vw,62px)!important;line-height:1.05!important;color:#fff!important;}
body.login-open .jpl-hero p,.login-open .jpl-hero span{color:rgba(255,255,255,.84)!important;}
body.login-open .jpl-hero .hero-art,.login-open .jpl-hero svg{max-width:520px!important;margin-top:32px;}
body.login-open .jpl-access{background:#fff!important;min-height:100vh!important;padding:clamp(28px,5vw,64px)!important;display:flex;flex-direction:column;justify-content:center;overflow:auto;}
body.login-open .jpl-access-top{border:0!important;padding:0 0 26px!important;}
body.login-open .jpl-welcome{margin:0 0 24px!important;}
body.login-open .jpl-welcome h2{font-size:28px!important;color:#10243b!important;}
body.login-open .jpl-welcome p{color:#718096!important;}
body.login-open .jpl-role-switch{background:#f2f6fa!important;border:1px solid #e1e9f0!important;border-radius:10px!important;padding:4px!important;}
body.login-open .jpl-role-choice{border-radius:7px!important;color:#627487!important;}
body.login-open .jpl-role-choice.active{background:#fff!important;color:#087bea!important;box-shadow:0 2px 8px rgba(16,36,59,.08)!important;}
body.login-open .jpl-login{border:1px solid #e1e9f0!important;border-radius:12px!important;box-shadow:0 12px 35px rgba(17,38,63,.07)!important;padding:22px!important;background:#fff!important;}
body.login-open .jpl-login-head{border:0!important;padding:0 0 16px!important;}
body.login-open .jpl-login-icon{background:#eaf4ff!important;color:#087bea!important;}
body.login-open .jpl-field>span:first-child{color:#263b50!important;}
body.login-open .jpl-input{border-color:#dce6ef!important;border-radius:8px!important;background:#fff!important;}
body.login-open .jpl-input:focus-within{border-color:#087bea!important;box-shadow:0 0 0 3px rgba(8,123,234,.10)!important;}
body.login-open .jpl-submit{background:#087bea!important;border-radius:8px!important;height:46px!important;}
body.login-open .jpl-demo-hint{background:#f5f9fd!important;border-color:#e1eaf2!important;color:#65778a!important;}
body.login-open .jpl-other-portals{display:none!important;}
body.login-open .jpl-footer{border-top:1px solid #edf1f5!important;margin-top:22px!important;padding-top:16px!important;color:#8795a4!important;}
body.login-open .jpl-footer .jpl-support{display:none!important;}
@media(max-width:820px){
 body.login-open .jpl-stage{grid-template-columns:1fr!important;}
 body.login-open .jpl-hero{min-height:250px!important;padding:30px 24px!important;}
 body.login-open .jpl-hero h1{font-size:34px!important;}
 body.login-open .jpl-hero .hero-art{display:none!important;}
 body.login-open .jpl-access{min-height:auto!important;padding:24px 16px 35px!important;}
}
.ref-header{height:64px!important;padding:0 32px!important;background:#fff!important;border-bottom:1px solid #e8eef4!important;}
.ref-header nav button{color:#40566c!important;}
.ref-header nav button:hover{color:#087bea!important;}
.ref-primary{background:#087bea!important;border-color:#087bea!important;}
.ref-primary:hover{background:#076ccf!important;}
.ref-screen{background:#f7fafd!important;}
.ref-home-photo{background:linear-gradient(135deg,#e9f5ff,#cfe8ff)!important;}
.ref-copy small,.ref-copy strong,.ref-title button,.ref-page-head small{color:#087bea!important;}
.ref-route-cards article:hover,.ref-result-card:hover{border-color:#b8dafa!important;box-shadow:0 8px 24px rgba(8,123,234,.08)!important;}
.ref-admin-shell aside,.ref-counter-shell aside{background:#082f56!important;}
.ref-admin-shell aside button.active,.ref-admin-shell aside button:hover,.ref-counter-shell aside button.active,.ref-counter-shell aside button:hover{background:#087bea!important;}
.ref-bus-map{background:#edf5fb!important;}
.ref-bus-map .ref-driver{background:#dceaf6!important;color:#31516d!important;}

/* JatraBD navigation cleanup: no legacy bottom nav and compact three-dot menus. */
body.ref-runtime .legacy-bottom-nav,
body.ref-runtime .bottom-nav,
body.authenticated .legacy-bottom-nav,
body.authenticated .bottom-nav { display:none !important; }

.ref-admin-shell aside,
.ref-counter-shell aside { display:none !important; }

.ref-admin-top,
.ref-counter-shell .ref-admin-top { position:relative; }

.ref-more-menu { position:relative; display:flex; align-items:center; }
.ref-more-trigger {
  width:34px; height:34px; border:1px solid #dce6ef; border-radius:8px;
  background:#fff; color:#40566c; font-size:22px; line-height:1;
  display:grid; place-items:center; cursor:pointer;
}
.ref-more-trigger:hover { border-color:#087bea; color:#087bea; background:#f4f9ff; }
.ref-more-panel {
  position:absolute; right:0; top:42px; z-index:500;
  min-width:170px; padding:6px;
  background:#fff; border:1px solid #dce6ef; border-radius:10px;
  box-shadow:0 14px 35px rgba(17,50,78,.16);
  display:none;
}
.ref-more-menu.open .ref-more-panel { display:grid; gap:2px; }
.ref-more-panel button {
  border:0; background:transparent; color:#344b60; text-align:left;
  padding:9px 11px; border-radius:7px; font-size:9px; font-weight:700; cursor:pointer;
}
.ref-more-panel button:hover { background:#edf6ff; color:#087bea; }
@media(max-width:760px){
  .ref-admin-shell aside,.ref-counter-shell aside { display:none !important; }
  .ref-more-trigger { width:32px; height:32px; }
}

/* JatraBD v23 — per-bus logo upload */
.ref-logo-upload{grid-column:1/-1}.ref-logo-upload-row{display:flex;align-items:center;gap:8px;margin-top:4px}.ref-logo-upload input[type=file]{flex:1;padding:6px;background:#fff}.ref-logo-upload small{display:block;margin-top:4px;font-size:7px;color:#7b8c9d;font-weight:500}.ref-logo-preview{width:44px;height:34px;border:1px solid #dfe8ee;border-radius:5px;background:#f5f9fc center/cover no-repeat;display:grid;place-items:center;flex:0 0 44px;font-size:6px;color:#8a98a5;text-align:center;overflow:hidden}.ref-bus-logo-thumb{background-color:#eef6fc!important;background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important}
@media(max-width:760px){.ref-logo-upload{grid-column:auto}.ref-logo-upload-row{align-items:stretch;flex-direction:column}.ref-logo-preview{width:58px;height:42px;flex-basis:42px}}

/* JatraBD v24/v25 — single three-dot navigation */
.ref-header{display:flex!important;align-items:center!important;justify-content:space-between!important;height:64px!important;padding:0 28px!important;position:relative!important;z-index:800!important}
.ref-header>nav,.ref-header>.ref-account{display:none!important}
.ref-public-menu{position:relative;display:flex;align-items:center}
.ref-public-menu-trigger{width:40px;height:40px;border:1px solid #d9e6f1;border-radius:12px;background:linear-gradient(145deg,#fff,#f2f8fd);color:#0b4c7d;font-size:25px;font-weight:800;line-height:1;display:grid;place-items:center;cursor:pointer;box-shadow:0 5px 14px rgba(17,58,91,.10);transition:.18s ease;letter-spacing:1px}
.ref-public-menu-trigger:hover,.ref-public-menu.open .ref-public-menu-trigger{color:#087bea;border-color:#9ecdf4;background:#eef7ff;transform:translateY(-1px);box-shadow:0 7px 18px rgba(8,123,234,.14)}
.ref-public-menu-panel{position:absolute;right:0;top:49px;width:205px;padding:8px;background:rgba(255,255,255,.98);border:1px solid #dce8f2;border-radius:14px;box-shadow:0 18px 45px rgba(12,48,80,.18);display:none;animation:refMenuIn .16s ease}
.ref-public-menu.open .ref-public-menu-panel{display:grid;gap:3px}
.ref-public-menu-head{padding:9px 11px 8px;border-bottom:1px solid #edf2f6;margin-bottom:3px;display:grid;gap:2px}
.ref-public-menu-head strong{font-size:11px;color:#0b3152}.ref-public-menu-head small{font-size:7px;color:#8a9aaa;text-transform:uppercase;letter-spacing:.7px}
.ref-public-menu-panel button{display:flex;align-items:center;gap:9px;width:100%;border:0;background:transparent;color:#3d5368;text-align:left;padding:10px 11px;border-radius:9px;font-size:9px;font-weight:800;cursor:pointer}
.ref-public-menu-panel button span{width:20px;height:20px;border-radius:6px;background:#edf6ff;color:#087bea;display:grid;place-items:center;font-size:11px}
.ref-public-menu-panel button:hover{background:#f1f8ff;color:#087bea}.ref-public-menu-panel button:hover span{background:#dcefff}
@keyframes refMenuIn{from{opacity:0;transform:translateY(-5px) scale(.98)}to{opacity:1;transform:none}}
@media(max-width:760px){.ref-header{height:58px!important;padding:0 16px!important}.ref-public-menu-trigger{width:38px;height:38px}.ref-public-menu-panel{right:0;width:190px;top:46px}}

/* JatraBD v26 — public Login only; authenticated users get one three-dot menu with exactly the requested items. */
.ref-more-menu{display:none!important}
.ref-public-login{border:1px solid #087bea;background:#087bea;color:#fff;border-radius:8px;padding:9px 18px;font-size:10px;font-weight:800;cursor:pointer;box-shadow:0 5px 14px rgba(8,123,234,.14)}
.ref-public-login:hover{background:#076ccf;border-color:#076ccf}
.ref-public-menu{display:none!important}
body.authenticated .ref-public-login{display:none!important}
body.authenticated .ref-public-menu{display:flex!important}
.ref-public-menu-panel{max-height:calc(100vh - 82px);overflow:auto}
@media(max-width:760px){
  .ref-public-login{padding:8px 15px;font-size:9px}
}

/* JatraBD bus approval workflow */
.ref-bus-access-notice{display:grid;gap:4px;margin:0 0 10px;padding:11px 13px;border:1px solid #cfe4f8;border-radius:8px;background:#f1f8ff;color:#34546f}.ref-bus-access-notice strong{font-size:10px;color:#087bea}.ref-bus-access-notice span{font-size:8px;line-height:1.5}
.ref-bus-owner-status{margin:0 0 10px;padding:11px 13px;border:1px solid #e0e9f0;border-radius:8px;background:#fff}.ref-bus-owner-status>strong{display:block;font-size:9px;margin-bottom:7px;color:#193a57}.ref-bus-owner-status>small{font-size:8px;color:#81909d}
.ref-owner-request-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-top:1px solid #edf2f6;font-size:8px}.ref-owner-request-row:first-of-type{border-top:0}.ref-request-status{font-size:7px;border-radius:10px;padding:4px 7px;white-space:nowrap}.ref-request-status.pending{background:#fff5db;color:#946d00}.ref-request-status.approved{background:#e7f8f0;color:#13845a}.ref-request-status.rejected{background:#fdebec;color:#b13a43}
.ref-bus-requests-panel{margin-top:10px}.ref-bus-requests-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}.ref-bus-requests-head h2{margin:0 0 3px}.ref-bus-requests-head small{font-size:7px;color:#82919e}.ref-request-badge{min-width:24px;height:24px;padding:0 7px;border-radius:12px;display:grid;place-items:center;background:#fff0d2;color:#9a6a00;font-size:8px;font-weight:900}.ref-bus-request-card{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid #edf2f6}.ref-bus-request-main{min-width:0;display:grid;gap:3px}.ref-bus-request-main strong{font-size:9px;color:#1b3c59}.ref-bus-request-main span{font-size:7px;color:#5e758a}.ref-bus-request-main p{margin:0;font-size:7px;color:#81909d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ref-bus-request-actions{display:flex;gap:6px;flex:0 0 auto}.ref-bus-request-actions button{min-width:58px}.ref-empty-request{padding:9px 0;font-size:8px;color:#81909d}
@media(max-width:760px){.ref-bus-request-card{align-items:flex-start;flex-direction:column}.ref-bus-request-actions{width:100%}.ref-bus-request-actions button{flex:1}.ref-owner-request-row{align-items:flex-start;flex-direction:column;gap:5px}}


/* v28 — Counter & Staff management */
.ref-manage-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.ref-manage-column,.ref-owner-request-status{background:#fff;border:1px solid #e6edf5;border-radius:16px;padding:18px}
.ref-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.ref-panel-head h2{margin:0;font-size:18px;color:#10233f}
.ref-panel-head small{display:block;color:#718096;margin-top:4px}
.ref-manage-list{display:grid;gap:10px}
.ref-manage-card{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #e8eef5;border-radius:12px;padding:12px;background:#fbfdff}
.ref-manage-card>div{display:flex;align-items:center;gap:10px;min-width:0}
.ref-manage-card strong{display:block;color:#13243c}
.ref-manage-card span,.ref-manage-card small{display:block;color:#718096;font-size:12px}
.ref-staff-code-pill{display:inline-flex!important;align-items:center;gap:6px;background:#f0f7ff;border:1px solid #d0e4ff;padding:2px 8px;border-radius:6px;color:#0052cc!important;font-size:11px!important;margin-top:4px}
.ref-staff-code-pill b{font-family:monospace;letter-spacing:1px;font-size:12px;color:#004099}
.ref-code-copy-btn{background:#ffffff;border:1px solid #c2dbff;color:#0052cc;padding:1px 6px;border-radius:4px;font-size:10px;font-weight:600;cursor:pointer;transition:all 0.15s ease}
.ref-code-copy-btn:hover{background:#0052cc;color:#ffffff;border-color:#0052cc}
.ref-staff-person img,.ref-staff-avatar{width:42px;height:42px;border-radius:50%;object-fit:cover;background:#e8f3ff;display:grid;place-items:center;font-weight:800;color:#087bea;flex:0 0 42px}
.ref-request-status{display:inline-flex!important;align-items:center;padding:4px 8px;border-radius:999px;font-size:11px!important;font-weight:800}
.ref-request-status.approved{background:#e7f8ee;color:#16814f}
.ref-request-status.pending{background:#fff4d8;color:#986b00}
.ref-request-status.rejected{background:#ffe9ed;color:#b4233c}
.ref-owner-request-status{margin-top:18px}
.ref-owner-request-status h3{margin:0 0 10px;color:#10233f}
.ref-owner-request-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid #edf1f5}
.ref-bus-requests-panel{margin-top:18px}
.ref-empty-request{padding:18px;border:1px dashed #d8e2ed;border-radius:12px;color:#718096;text-align:center;background:#fbfdff}
@media(max-width:900px){.ref-manage-grid{grid-template-columns:1fr}}
@media(max-width:640px){.ref-panel-head{align-items:flex-start;flex-direction:column}.ref-manage-card{align-items:flex-start;flex-direction:column}}
body[data-portal="counter"] [data-management-menu]{display:none!important}


/* v29 — long bus seat layout + yellow free booking */
.sales-center .panel-heading{align-items:flex-start}
.bus-seat-wrap{
  width:min(100%,360px);
  max-width:360px;
  min-height:720px;
  margin:0 auto 16px;
  padding:28px 22px 28px;
  border:2px solid #e5e1f8;
  border-radius:0;
  background:linear-gradient(180deg,#fcfbff,#f4f1ff);
  box-shadow:0 12px 30px rgba(77,55,135,.10);
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.bus-front{
  height:48px;
  padding:0 18px;
  border-radius:0;
  color:#836ee0;
  background:#ece7fe;
  font-size:11px;
}
.bus-front i{width:24px;height:24px}
.seat-grid{
  display:grid;
  grid-template-columns:minmax(58px,1fr) minmax(58px,1fr) minmax(24px,.35fr) minmax(58px,1fr) minmax(58px,1fr);
  gap:14px 10px;
  width:100%;
  max-width:330px;
  margin:0 auto;
  align-items:center;
}
.seat-aisle{height:54px;min-width:20px;position:relative}
.seat-aisle::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:#e3def4}
.seat-button{
  height:54px;
  min-width:58px;
  border:1.5px solid #8bd2a8;
  border-radius:0;
  color:#208651;
  background:#dcf6e5;
  font-size:13px;
  font-weight:900;
  box-shadow:0 3px 8px rgba(45,126,76,.08);
}
.seat-button:hover:not(.booked):not(.free):not(.blocked){
  transform:translateY(-2px);
  box-shadow:0 7px 13px rgba(44,126,76,.16);
}
.seat-button.selected{border-color:#5630c8;color:#fff;background:#643bd8}
.seat-button.booked{border-color:#ffbac1;color:#d44d5c;background:#ffe1e4}
.seat-button.free{border-color:#e2b21f;color:#6f5200;background:#ffd84d;cursor:not-allowed;box-shadow:0 3px 9px rgba(214,166,0,.16)}
.seat-button.blocked{border-color:#dde1e5;color:#8992a0;background:#edf0f2}
.seat-icon.free{border-color:#e2b21f;background:#ffd84d}
.free-booking-button{
  margin-top:8px;
  border-color:#e2b21f!important;
  color:#6f5200!important;
  background:#ffd84d!important;
}
.free-booking-button:hover:not(:disabled){background:#f5c52f!important;border-color:#d6a900!important}
.free-booking-button:disabled{opacity:.55;cursor:not-allowed}
.free-booking-note{display:block;margin-top:7px;color:#8a6a00;font-size:9px;line-height:1.45}
.free-remove-button{margin-left:8px;padding:4px 7px;border:1px solid #e2b21f;border-radius:6px;background:#ffd84d;color:#6f5200;font-size:8px;font-weight:800;cursor:pointer}
.free-remove-button:disabled{opacity:.55;cursor:not-allowed;background:#f5e8ad;color:#887b4b}
.status--free{color:#795b00!important;background:#fff1b8!important;border-color:#f1d36b!important}
@media(max-width:760px){
  .bus-seat-wrap{width:min(100%,340px);min-height:680px;padding:22px 16px 24px;border-radius:0}
  .seat-grid{grid-template-columns:minmax(45px,1fr) minmax(45px,1fr) minmax(20px,.35fr) minmax(45px,1fr) minmax(45px,1fr);gap:10px 7px}
  .seat-button{height:50px;min-width:50px;font-size:12px}
  .seat-aisle{height:50px}
}

/* v32 — Login touch/click safety */
.ref-public-login{position:relative;z-index:100;pointer-events:auto!important;touch-action:manipulation;}
.ref-header{position:sticky;z-index:200;}
.login-screen{pointer-events:auto;touch-action:manipulation;}
.login-screen *{pointer-events:auto;}

/* v33 — Counter Portal inline seat selection */
.ref-counter-seat-panel{margin-top:18px;padding:18px;border:1px solid #dfe8f0;border-radius:8px;background:#fff;scroll-margin-top:75px;box-shadow:0 8px 24px rgba(19,55,83,.07)}
.ref-counter-seat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}
.ref-counter-seat-head h2{margin:3px 0;font-size:18px;color:#153653}
.ref-counter-seat-head p{margin:0;color:#81909d;font-size:9px}
.ref-counter-seat-head .ref-seat-legend{display:flex;gap:10px;flex-wrap:wrap}
.ref-counter-seat-info{display:flex;justify-content:space-between;gap:16px;padding:12px 14px;margin-bottom:14px;border:1px solid #e4edf3;background:#f8fbfd;border-radius:6px}
.ref-counter-seat-info div{display:flex;flex-direction:column;gap:4px}
.ref-counter-seat-info span{font-size:9px;color:#718497}.ref-counter-seat-info strong{font-size:12px;color:#183a57}
.ref-counter-bus{width:min(100%,390px);margin:0 auto;padding:24px 20px 20px;border:2px solid #dce6ee;border-radius:4px;background:#f8fbfd}
.ref-counter-driver{height:38px;display:flex;align-items:center;justify-content:center;margin-bottom:22px;border:1px solid #b9c9d6;background:#eef4f8;color:#60778a;font-size:9px;font-weight:900;letter-spacing:1px}
.ref-counter-seat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px 9px;align-items:center}
.ref-counter-seat-grid button{height:58px;min-width:0;border:1.5px solid #8bd2a8;border-radius:4px;background:#eaf8ef;color:#17663b;font-size:12px;font-weight:900;cursor:pointer}
.ref-counter-seat-grid button:hover{transform:translateY(-1px)}
.ref-counter-seat-grid button.booked{border-color:#e5a8ad;background:#fbe8ea;color:#a83c46;cursor:not-allowed}
.ref-counter-seat-grid button.selected{border-color:#1687e8;background:#1687e8;color:#fff}
.ref-counter-seat-aisle{display:block;min-height:58px}
.ref-counter-seat-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:16px;padding:12px 14px;border-top:1px solid #e7eef3}
.ref-counter-seat-footer div{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ref-counter-seat-footer small{font-size:8px;color:#82919d}.ref-counter-seat-footer b{font-size:10px;color:#36536b}.ref-counter-seat-footer strong{font-size:13px;color:#153653}
@media(max-width:760px){
 .ref-counter-seat-panel{padding:12px;margin-top:14px}
 .ref-counter-seat-head{display:block}.ref-counter-seat-head .ref-seat-legend{margin-top:10px}
 .ref-counter-seat-info{display:grid;grid-template-columns:1fr}
 .ref-counter-bus{width:min(100%,350px);padding:20px 13px 16px}
 .ref-counter-seat-grid{gap:9px 7px}
 .ref-counter-seat-grid button{height:56px;font-size:11px}
 .ref-counter-seat-aisle{min-height:56px}
 .ref-counter-seat-footer{align-items:flex-end}
}


/* v34 — Unified three-dot portal menu: Counter, Owner & Super Admin */
.ref-public-menu-panel{
  width:248px!important;
  padding:10px!important;
  border:1px solid #d9e7f2!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.99)!important;
  box-shadow:0 20px 55px rgba(12,48,80,.20)!important;
}
.ref-public-menu-panel button{
  min-height:46px!important;
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  padding:7px 10px!important;
  border:1px solid transparent!important;
  border-radius:12px!important;
  color:#29465e!important;
  font-size:12px!important;
  font-weight:750!important;
  letter-spacing:-.1px;
  transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.ref-public-menu-panel button .menu-icon{
  width:32px!important;
  height:32px!important;
  flex:0 0 32px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:10px!important;
  background:linear-gradient(145deg,#eef7ff,#e3f1fc)!important;
  border:1px solid #d6e9f7!important;
  font-size:16px!important;
  line-height:1!important;
  box-shadow:0 3px 8px rgba(8,123,234,.07);
}
.ref-public-menu-panel button .menu-label{
  flex:1!important;
  display:flex!important;
  align-items:center!important;
  min-height:32px!important;
  white-space:nowrap!important;
}
.ref-public-menu-panel button:hover{
  background:linear-gradient(90deg,#f1f8ff,#f8fbff)!important;
  border-color:#d5e9f8!important;
  color:#087bea!important;
  transform:translateX(2px);
  box-shadow:0 5px 14px rgba(8,123,234,.07);
}
.ref-public-menu-panel button:hover .menu-icon{
  background:linear-gradient(145deg,#dcefff,#cfe8fb)!important;
  border-color:#bcdcf4!important;
}
.ref-public-menu-panel button:last-child{
  margin-top:4px;
  padding-top:9px!important;
  border-top:1px solid #edf2f6!important;
  border-radius:0 0 12px 12px!important;
}
.ref-public-menu-panel button:last-child .menu-icon{
  background:#fff0f1!important;
  border-color:#ffd8dc!important;
}
.ref-public-menu-head{
  padding:7px 10px 10px!important;
  margin-bottom:4px!important;
}
.ref-public-menu-head strong{font-size:12px!important;color:#123b5d!important}
.ref-public-menu-head small{font-size:8px!important;color:#8799a9!important}
@media(max-width:760px){
  .ref-public-menu-panel{width:230px!important;padding:8px!important}
  .ref-public-menu-panel button{min-height:44px!important;font-size:11px!important}
  .ref-public-menu-panel button .menu-icon{width:30px!important;height:30px!important;flex-basis:30px!important;font-size:15px!important}
}


/* v35 — Strong visible three-dot menu redesign for ALL authenticated portals */
body.authenticated .ref-public-menu-panel{
  width:270px!important;
  padding:12px!important;
  background:#ffffff!important;
  border:1px solid #cfe2f1!important;
  border-radius:20px!important;
  box-shadow:0 22px 60px rgba(8,48,82,.22)!important;
}
body.authenticated .ref-public-menu-head{
  padding:8px 10px 12px!important;
  margin:0 0 7px!important;
  border-bottom:1px solid #e8f0f6!important;
}
body.authenticated .ref-public-menu-head strong{
  display:block!important;
  font-size:14px!important;
  color:#123b5d!important;
  letter-spacing:-.2px!important;
}
body.authenticated .ref-public-menu-head small{
  display:block!important;
  margin-top:2px!important;
  font-size:8px!important;
  color:#7b91a3!important;
}
body.authenticated .ref-public-menu-panel button{
  min-height:52px!important;
  margin:3px 0!important;
  padding:7px 9px!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  border:1px solid #e6eef5!important;
  border-radius:14px!important;
  background:#fbfdff!important;
  color:#25445d!important;
  font-size:12px!important;
  font-weight:800!important;
  box-shadow:0 2px 7px rgba(20,65,95,.04)!important;
  transform:none!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon{
  width:36px!important;
  height:36px!important;
  flex:0 0 36px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:11px!important;
  font-size:18px!important;
  background:#e9f5ff!important;
  border:1px solid #cde7f8!important;
  box-shadow:none!important;
}
body.authenticated .ref-public-menu-panel button .menu-label{
  min-height:36px!important;
  display:flex!important;
  align-items:center!important;
  flex:1!important;
  color:#24445e!important;
  font-size:12px!important;
}
body.authenticated .ref-public-menu-panel button:nth-of-type(1) .menu-icon{background:#eeeaff!important;border-color:#ddd5ff!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(2) .menu-icon{background:#e8f7ef!important;border-color:#ccebd9!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(3) .menu-icon{background:#fff3df!important;border-color:#f7dfb3!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(4) .menu-icon{background:#e9f5ff!important;border-color:#cde7f8!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(5) .menu-icon{background:#f0ebff!important;border-color:#ddd3ff!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(6) .menu-icon{background:#e9f8f6!important;border-color:#ccece6!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(7) .menu-icon{background:#fff0e6!important;border-color:#f6d7bf!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(8) .menu-icon{background:#f1f3f7!important;border-color:#dfe4ea!important}
body.authenticated .ref-public-menu-panel button:hover{
  background:#f3f9ff!important;
  border-color:#9ecdf0!important;
  color:#087bea!important;
  transform:translateX(2px)!important;
  box-shadow:0 6px 16px rgba(8,123,234,.10)!important;
}
body.authenticated .ref-public-menu-panel button:hover .menu-label{color:#087bea!important}
body.authenticated .ref-public-menu-panel button:last-child{
  margin-top:9px!important;
  padding-top:7px!important;
  border-top:0!important;
  background:#fff5f6!important;
  border-color:#ffdadd!important;
}
body.authenticated .ref-public-menu-panel button:last-child .menu-icon{
  background:#ffe7ea!important;
  border-color:#ffcbd1!important;
}
body.authenticated .ref-public-menu-panel button:last-child .menu-label{color:#c33f4d!important}
body.authenticated .ref-public-menu-panel button:last-child:hover{
  background:#ffebee!important;
  border-color:#ffbfc7!important;
}
@media(max-width:760px){
 body.authenticated .ref-public-menu-panel{width:250px!important;padding:10px!important}
 body.authenticated .ref-public-menu-panel button{min-height:50px!important;font-size:11px!important}
 body.authenticated .ref-public-menu-panel button .menu-icon{width:34px!important;height:34px!important;flex-basis:34px!important;font-size:17px!important}
 body.authenticated .ref-public-menu-panel button .menu-label{font-size:11px!important}
}


/* v36 — final visible portal three-dot menu refresh */
body.authenticated .ref-public-menu-panel{
  width:280px!important;
  padding:14px!important;
  border:2px solid #b9d8ee!important;
  border-radius:22px!important;
  background:#ffffff!important;
  box-shadow:0 24px 65px rgba(10,55,90,.24)!important;
}
body.authenticated .ref-public-menu-panel button{
  min-height:56px!important;
  margin:4px 0!important;
  padding:8px 10px!important;
  border:1px solid #d8e7f2!important;
  border-radius:15px!important;
  background:#fafdff!important;
  color:#173b57!important;
  font-size:13px!important;
  font-weight:800!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon{
  width:38px!important;height:38px!important;flex:0 0 38px!important;
  border-radius:12px!important;font-size:19px!important;
}
body.authenticated .ref-public-menu-panel button:nth-of-type(1){background:#f8f6ff!important;border-color:#e3dcff!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(2){background:#f2fbf6!important;border-color:#d6f0df!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(3){background:#fffaf0!important;border-color:#f5e4bd!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(4){background:#f2f9ff!important;border-color:#d5eafb!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(5){background:#f8f5ff!important;border-color:#e2d9ff!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(6){background:#f1fbfa!important;border-color:#d4efeb!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(7){background:#fff8f2!important;border-color:#f4dfcc!important}
body.authenticated .ref-public-menu-panel button:nth-of-type(8){background:#f6f7fa!important;border-color:#e1e5eb!important}
body.authenticated .ref-public-menu-panel button:hover{
  transform:translateX(3px)!important;
  border-color:#65afe1!important;
  box-shadow:0 8px 20px rgba(8,123,234,.12)!important;
  background:#eef8ff!important;
}
body.authenticated .ref-public-menu-panel button:last-child{
  margin-top:10px!important;
  background:#fff1f3!important;
  border-color:#ffcbd2!important;
}
@media(max-width:760px){
  body.authenticated .ref-public-menu-panel{width:260px!important;padding:11px!important}
  body.authenticated .ref-public-menu-panel button{min-height:53px!important;font-size:12px!important}
  body.authenticated .ref-public-menu-panel button .menu-icon{width:36px!important;height:36px!important;flex-basis:36px!important;font-size:18px!important}
}


/* v37 — Professional realistic icon menu: single-line rows */
body.authenticated .ref-public-menu-panel{
  width:292px!important;
  padding:10px!important;
  border:1px solid #d6e3ee!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 20px 55px rgba(19,54,80,.18)!important;
}
body.authenticated .ref-public-menu-head{
  padding:6px 10px 9px!important;
  margin:0 0 6px!important;
}
body.authenticated .ref-public-menu-head strong{font-size:13px!important;color:#173d59!important}
body.authenticated .ref-public-menu-head small{font-size:8px!important;color:#8295a5!important}
body.authenticated .ref-public-menu-panel button{
  width:100%!important;
  min-height:48px!important;
  height:48px!important;
  margin:3px 0!important;
  padding:6px 9px!important;
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  gap:11px!important;
  border:1px solid #e3ebf1!important;
  border-radius:12px!important;
  background:#fbfdff!important;
  color:#29465d!important;
  font-size:12px!important;
  font-weight:750!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  box-shadow:0 2px 7px rgba(18,57,84,.035)!important;
  transform:none!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  flex:0 0 32px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:9px!important;
  background:#edf6fd!important;
  border:1px solid #d5e8f5!important;
  color:#1680c8!important;
  font-size:0!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon svg{
  width:18px!important;
  height:18px!important;
  display:block!important;
  stroke:currentColor!important;
}
body.authenticated .ref-public-menu-panel button .menu-label{
  min-width:0!important;
  min-height:32px!important;
  display:flex!important;
  align-items:center!important;
  flex:1 1 auto!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:inherit!important;
  font-size:12px!important;
}
body.authenticated .ref-public-menu-panel button:nth-of-type(1) .menu-icon{color:#6846c9;background:#f1edff;border-color:#e0d8ff}
body.authenticated .ref-public-menu-panel button:nth-of-type(2) .menu-icon{color:#168457;background:#eaf8f0;border-color:#d1eddd}
body.authenticated .ref-public-menu-panel button:nth-of-type(3) .menu-icon{color:#d17a12;background:#fff5e5;border-color:#f4dfbb}
body.authenticated .ref-public-menu-panel button:nth-of-type(4) .menu-icon{color:#147ec1;background:#eaf6ff;border-color:#d0e8f8}
body.authenticated .ref-public-menu-panel button:nth-of-type(5) .menu-icon{color:#5270b7;background:#edf2ff;border-color:#d9e1f7}
body.authenticated .ref-public-menu-panel button:nth-of-type(6) .menu-icon{color:#8a50bf;background:#f5edff;border-color:#e7d8fa}
body.authenticated .ref-public-menu-panel button:nth-of-type(7) .menu-icon{color:#168b82;background:#eaf8f6;border-color:#d1ece8}
body.authenticated .ref-public-menu-panel button:nth-of-type(8) .menu-icon{color:#687789;background:#f1f4f7;border-color:#dfe5ea}
body.authenticated .ref-public-menu-panel button:hover{
  background:#f3f9fd!important;
  border-color:#9dcbe8!important;
  color:#0875b8!important;
  transform:translateX(2px)!important;
  box-shadow:0 5px 14px rgba(8,117,184,.09)!important;
}
body.authenticated .ref-public-menu-panel button:last-child{
  margin-top:8px!important;
  background:#fff5f6!important;
  border-color:#ffd9dd!important;
  color:#c44754!important;
}
body.authenticated .ref-public-menu-panel button:last-child .menu-icon{
  color:#c44754!important;background:#ffe9ec!important;border-color:#ffd0d5!important;
}
@media(max-width:760px){
  body.authenticated .ref-public-menu-panel{width:270px!important;padding:8px!important}
  body.authenticated .ref-public-menu-panel button{height:46px!important;min-height:46px!important;font-size:11px!important}
  body.authenticated .ref-public-menu-panel button .menu-icon{width:30px!important;height:30px!important;min-width:30px!important;flex-basis:30px!important}
  body.authenticated .ref-public-menu-panel button .menu-icon svg{width:17px!important;height:17px!important}
  body.authenticated .ref-public-menu-panel button .menu-label{font-size:11px!important}
}


/* v38 — Compact portal menu: smaller text + guaranteed visible SVG icons */
body.authenticated .ref-public-menu-panel{
  width:240px!important;
  padding:7px!important;
  border:1px solid #dbe6ee!important;
  border-radius:14px!important;
  box-shadow:0 14px 36px rgba(19,54,80,.16)!important;
}
body.authenticated .ref-public-menu-head{
  padding:4px 7px 6px!important;
  margin:0 0 4px!important;
}
body.authenticated .ref-public-menu-head strong{font-size:10px!important;line-height:1.2!important}
body.authenticated .ref-public-menu-head small{font-size:7px!important;line-height:1.2!important}
body.authenticated .ref-public-menu-panel button{
  min-height:38px!important;
  height:38px!important;
  margin:2px 0!important;
  padding:4px 6px!important;
  gap:7px!important;
  border-radius:9px!important;
  font-size:10px!important;
  font-weight:700!important;
  line-height:1!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon{
  width:26px!important;
  height:26px!important;
  min-width:26px!important;
  flex:0 0 26px!important;
  border-radius:7px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  font-size:0!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon > i{
  width:15px!important;
  height:15px!important;
  min-width:15px!important;
  display:grid!important;
  place-items:center!important;
  margin:0!important;
  padding:0!important;
  color:inherit!important;
  font-size:0!important;
  line-height:0!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon > i svg{
  width:15px!important;
  height:15px!important;
  display:block!important;
  color:inherit!important;
  stroke:currentColor!important;
  visibility:visible!important;
  opacity:1!important;
}
body.authenticated .ref-public-menu-panel button .menu-label{
  min-height:26px!important;
  font-size:10px!important;
  font-weight:700!important;
  line-height:1!important;
  white-space:nowrap!important;
}
body.authenticated .ref-public-menu-panel button:last-child{margin-top:5px!important}
@media(max-width:760px){
  body.authenticated .ref-public-menu-panel{width:220px!important;padding:6px!important}
  body.authenticated .ref-public-menu-panel button{height:36px!important;min-height:36px!important;font-size:9.5px!important;gap:6px!important}
  body.authenticated .ref-public-menu-panel button .menu-icon{width:24px!important;height:24px!important;min-width:24px!important;flex-basis:24px!important}
  body.authenticated .ref-public-menu-panel button .menu-icon > i,
  body.authenticated .ref-public-menu-panel button .menu-icon > i svg{width:14px!important;height:14px!important}
  body.authenticated .ref-public-menu-panel button .menu-label{font-size:9.5px!important}
}


/* v39 — Ultra-compact three-dot menu: fit all options in one view */
body.authenticated .ref-public-menu-panel{
  width:205px!important;
  max-height:none!important;
  padding:5px!important;
  border-radius:11px!important;
  box-shadow:0 10px 26px rgba(19,54,80,.14)!important;
}
body.authenticated .ref-public-menu-head{
  padding:2px 5px 4px!important;
  margin:0 0 2px!important;
}
body.authenticated .ref-public-menu-head strong{font-size:8px!important;line-height:1!important}
body.authenticated .ref-public-menu-head small{font-size:6px!important;line-height:1!important}
body.authenticated .ref-public-menu-panel button{
  min-height:30px!important;
  height:30px!important;
  margin:1px 0!important;
  padding:2px 4px!important;
  gap:5px!important;
  border-radius:7px!important;
  font-size:8.5px!important;
  font-weight:700!important;
  line-height:1!important;
  box-shadow:none!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon{
  width:21px!important;
  height:21px!important;
  min-width:21px!important;
  flex:0 0 21px!important;
  border-radius:5px!important;
  border-width:1px!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon > i,
body.authenticated .ref-public-menu-panel button .menu-icon > i svg{
  width:12px!important;
  height:12px!important;
}
body.authenticated .ref-public-menu-panel button .menu-label{
  min-height:21px!important;
  font-size:8.5px!important;
  font-weight:700!important;
  line-height:1!important;
}
body.authenticated .ref-public-menu-panel button:last-child{margin-top:3px!important}
body.authenticated .ref-public-menu-panel button:hover{transform:translateX(1px)!important}
@media(max-width:760px){
  body.authenticated .ref-public-menu-panel{width:190px!important;padding:4px!important}
  body.authenticated .ref-public-menu-panel button{height:28px!important;min-height:28px!important;font-size:8px!important;gap:4px!important}
  body.authenticated .ref-public-menu-panel button .menu-icon{width:19px!important;height:19px!important;min-width:19px!important;flex-basis:19px!important}
  body.authenticated .ref-public-menu-panel button .menu-icon > i,
  body.authenticated .ref-public-menu-panel button .menu-icon > i svg{width:11px!important;height:11px!important}
  body.authenticated .ref-public-menu-panel button .menu-label{font-size:8px!important;min-height:19px!important}
}

/* v40 — Remove white inner menu cards and force visible SVG icons */
body.authenticated .ref-public-menu-panel{
  top:6px!important;
  padding:4px!important;
  background:rgba(248,250,255,.98)!important;
}
body.authenticated .ref-public-menu-panel button{
  background:transparent!important;
  border:0!important;
  color:inherit!important;
  box-shadow:none!important;
}
body.authenticated .ref-public-menu-panel button:hover,
body.authenticated .ref-public-menu-panel button:focus-visible{
  background:rgba(255,255,255,.45)!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon{
  background:transparent!important;
  box-shadow:none!important;
  color:currentColor!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon > i{
  display:grid!important;
  place-items:center!important;
  width:14px!important;
  height:14px!important;
  color:currentColor!important;
  opacity:1!important;
  visibility:visible!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon > i svg{
  display:block!important;
  width:14px!important;
  height:14px!important;
  max-width:none!important;
  max-height:none!important;
  opacity:1!important;
  visibility:visible!important;
  stroke:currentColor!important;
  fill:none!important;
}
body.authenticated .ref-public-menu-panel button .menu-label{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
@media(max-width:760px){
  body.authenticated .ref-public-menu-panel{top:4px!important}
  body.authenticated .ref-public-menu-panel button .menu-icon > i,
  body.authenticated .ref-public-menu-panel button .menu-icon > i svg{
    width:13px!important;height:13px!important;
  }
}

/* v41 — Compact all-portal three-dot menu: no tall dropdown, clear icons */
.ref-public-menu{position:relative!important;z-index:100!important}
.ref-public-menu-panel{
  position:absolute!important;
  top:calc(100% + 5px)!important;
  right:0!important;
  left:auto!important;
  width:176px!important;
  max-width:calc(100vw - 16px)!important;
  max-height:none!important;
  height:auto!important;
  overflow:visible!important;
  padding:4px!important;
  margin:0!important;
  border-radius:9px!important;
  background:rgba(248,250,255,.98)!important;
}
.ref-public-menu-head{padding:2px 4px 3px!important;margin:0!important}
.ref-public-menu-head strong{font-size:7px!important;line-height:1!important}
.ref-public-menu-head small{font-size:5.5px!important;line-height:1!important}
.ref-public-menu-panel button{
  width:100%!important;
  min-width:0!important;
  min-height:24px!important;
  height:24px!important;
  margin:1px 0!important;
  padding:1px 3px!important;
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  border:0!important;
  border-radius:5px!important;
  background:transparent!important;
  box-shadow:none!important;
  font-size:7px!important;
  line-height:1!important;
  font-weight:700!important;
  white-space:nowrap!important;
}
.ref-public-menu-panel button .menu-icon{
  width:18px!important;height:18px!important;min-width:18px!important;flex:0 0 18px!important;
  display:grid!important;place-items:center!important;
  padding:0!important;border:0!important;border-radius:4px!important;
  background:transparent!important;box-shadow:none!important;
}
.ref-public-menu-panel button .menu-icon i,
.ref-public-menu-panel button .menu-icon i svg{
  display:block!important;width:12px!important;height:12px!important;
  min-width:12px!important;min-height:12px!important;
  opacity:1!important;visibility:visible!important;
}
.ref-public-menu-panel button .menu-icon i{color:currentColor!important}
.ref-public-menu-panel button .menu-icon i svg{stroke:currentColor!important;fill:none!important}
.ref-public-menu-panel button .menu-label{
  display:block!important;min-width:0!important;min-height:0!important;
  overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  font-size:7px!important;line-height:1!important;font-weight:700!important;
}
.ref-public-menu-panel button:hover{transform:none!important;background:rgba(91,43,216,.06)!important}
.ref-public-menu-panel button:last-child{margin-top:2px!important}
@media(max-width:760px){
 .ref-public-menu-panel{width:168px!important;top:calc(100% + 4px)!important;padding:3px!important}
 .ref-public-menu-panel button{height:23px!important;min-height:23px!important;font-size:6.7px!important;gap:3px!important}
 .ref-public-menu-panel button .menu-icon{width:17px!important;height:17px!important;min-width:17px!important;flex-basis:17px!important}
 .ref-public-menu-panel button .menu-icon i,.ref-public-menu-panel button .menu-icon i svg{width:11px!important;height:11px!important;min-width:11px!important;min-height:11px!important}
 .ref-public-menu-panel button .menu-label{font-size:6.7px!important}
}

/* v42 — Final requested size only: normal compact text and menu boxes */
.ref-public-menu-panel button{
  height:32px!important;min-height:32px!important;padding:3px 6px!important;gap:6px!important;
  font-size:11px!important;line-height:1.1!important;
}
.ref-public-menu-panel button .menu-label{font-size:11px!important;line-height:1.1!important}
.ref-public-menu-panel button .menu-icon{width:22px!important;height:22px!important;min-width:22px!important;flex-basis:22px!important}
.ref-public-menu-panel button .menu-icon i,
.ref-public-menu-panel button .menu-icon i svg{width:15px!important;height:15px!important;min-width:15px!important;min-height:15px!important}
@media(max-width:760px){
 .ref-public-menu-panel button{height:31px!important;min-height:31px!important;font-size:10.5px!important}
 .ref-public-menu-panel button .menu-label{font-size:10.5px!important}
 .ref-public-menu-panel button .menu-icon{width:21px!important;height:21px!important;min-width:21px!important;flex-basis:21px!important}
 .ref-public-menu-panel button .menu-icon i,.ref-public-menu-panel button .menu-icon i svg{width:14px!important;height:14px!important;min-width:14px!important;min-height:14px!important}
}


/* v44 — Compact two-column three-dot menu: 10 options in the height of 5 rows */
.ref-public-menu-panel{
  width:320px!important;
  padding:6px!important;
}
.ref-public-menu-head{
  grid-column:1 / -1!important;
}
.ref-public-menu-panel{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:2px!important;
}
.ref-public-menu-panel button{
  width:100%!important;
  height:32px!important;
  min-height:32px!important;
  margin:0!important;
  padding:3px 5px!important;
  gap:5px!important;
  font-size:10px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.ref-public-menu-panel button .menu-icon{
  width:21px!important;height:21px!important;min-width:21px!important;flex:0 0 21px!important;
}
.ref-public-menu-panel button .menu-icon i,
.ref-public-menu-panel button .menu-icon i svg{
  width:14px!important;height:14px!important;min-width:14px!important;min-height:14px!important;
  display:block!important;visibility:visible!important;opacity:1!important;
}
.ref-public-menu-panel button .menu-label{
  font-size:10px!important;line-height:1!important;white-space:nowrap!important;
}
.ref-public-menu-panel button:last-child{margin-top:0!important}
@media(max-width:760px){
  .ref-public-menu-panel{width:300px!important;max-width:calc(100vw - 12px)!important;padding:5px!important;gap:2px!important}
  .ref-public-menu-panel button{height:30px!important;min-height:30px!important;font-size:9px!important;padding:2px 4px!important;gap:4px!important}
  .ref-public-menu-panel button .menu-icon{width:20px!important;height:20px!important;min-width:20px!important;flex-basis:20px!important}
  .ref-public-menu-panel button .menu-icon i,
  .ref-public-menu-panel button .menu-icon i svg{width:13px!important;height:13px!important;min-width:13px!important;min-height:13px!important}
  .ref-public-menu-panel button .menu-label{font-size:9px!important}
}


/* v45 — Smaller Stop Directory label in three-dot menu only */
.ref-public-menu-panel .jp-stop-menu-btn > span:last-child{font-size:8px!important;line-height:1!important;}
@media(max-width:760px){.ref-public-menu-panel .jp-stop-menu-btn > span:last-child{font-size:7px!important;}}

/* JatraBD v27 — structured three-dot portal menu */
.ref-menu-section{grid-column:1 / -1!important;display:flex!important;align-items:center!important;padding:5px 6px 2px!important;margin-top:3px!important;color:#8a93a8!important;font-size:7px!important;font-weight:900!important;letter-spacing:.13em!important;text-transform:uppercase!important;line-height:1!important;border-top:1px solid #edf0f5!important;background:transparent!important}
.ref-menu-section:first-of-type{border-top:0!important;margin-top:0!important}
.ref-menu-section span{opacity:.9!important}
.ref-public-menu-panel button{min-height:34px!important;padding:6px 8px!important;border:1px solid transparent!important;transition:background .16s ease,border-color .16s ease,transform .16s ease!important}
.ref-public-menu-panel button:hover{border-color:#dcecff!important;transform:translateX(1px)!important}
@media(max-width:760px){.ref-menu-section{font-size:6.5px!important;padding:4px 5px 2px!important}.ref-public-menu-panel button{min-height:32px!important}}

/* JatraBD v28 — route management cards */
.ref-route-manage-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 16px;margin:0 0 10px;background:#fff;border:1px solid #e7edf4;border-radius:13px;box-shadow:0 5px 16px rgba(15,42,70,.05)}
.ref-route-manage-main{display:flex;align-items:flex-start;gap:11px;min-width:0}.ref-route-manage-icon{width:34px;height:34px;flex:0 0 34px;border-radius:10px;background:#eef7ff;color:#087bea;display:grid;place-items:center;font-weight:900}.ref-route-manage-main strong{display:block;color:#17324d;font-size:13px}.ref-route-manage-main p{margin:4px 0 0;color:#8190a1;font-size:10px;line-height:1.45}.ref-route-manage-meta{display:flex;align-items:center;gap:10px;flex:0 0 auto}.ref-route-manage-meta span{font-size:9px;color:#8190a1}.ref-route-manage-meta b{color:#17324d}.ref-route-manage-meta .ref-outline{white-space:nowrap}
@media(max-width:650px){.ref-route-manage-card{align-items:flex-start;flex-direction:column}.ref-route-manage-meta{width:100%;justify-content:flex-end}}

/* Selected feature set: shift management, passenger search, notification center */
.notification-summary-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}.notification-summary-row article{padding:15px 18px;border:1px solid var(--line);border-radius:12px;background:var(--paper);box-shadow:var(--shadow)}.notification-summary-row small,.notification-summary-row strong{display:block}.notification-summary-row small{color:var(--muted);font-size:10px}.notification-summary-row strong{margin-top:4px;font-size:22px}.notification-filter-row{display:flex;gap:7px;margin:0 0 12px}
.shift-layout{display:grid;grid-template-columns:minmax(280px,.8fr) minmax(0,1.4fr);gap:15px}.shift-control-panel{padding-bottom:20px}.shift-field,.shift-cash-grid label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:11px;font-weight:700}.shift-field{padding:0 20px}.shift-field select,.shift-cash-grid input{min-height:40px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);outline:0}.shift-current-status{margin:14px 20px;padding:12px;border-radius:10px;background:var(--canvas);display:flex;justify-content:space-between;gap:10px;align-items:center}.shift-cash-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 20px;margin-top:10px}.shift-actions{display:flex;gap:9px;padding:15px 20px 0}.shift-history{padding:0 16px 12px}.shift-row{display:grid;grid-template-columns:1.3fr .7fr 1fr 1fr 1fr;gap:10px;align-items:center;padding:12px 5px;border-bottom:1px solid #eff0f5}.shift-row:last-child{border-bottom:0}.shift-row strong,.shift-row small{display:block}.shift-row strong{font-size:11px}.shift-row small{color:var(--muted);font-size:9px;margin-bottom:2px}
.passenger-search-box{flex:1}.passenger-results{display:grid;gap:10px}.passenger-result{display:grid;grid-template-columns:42px minmax(0,1fr) minmax(260px,.8fr);gap:12px;align-items:center;padding:15px;border:1px solid var(--line);border-radius:12px;background:var(--paper);box-shadow:var(--shadow)}.passenger-avatar{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-weight:800;font-size:12px}.passenger-main h3{margin:0;font-size:13px}.passenger-main p,.passenger-main small{display:block;margin:3px 0 0;color:var(--muted);font-size:10px}.passenger-tickets{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end}.passenger-tickets span{padding:5px 7px;border:1px solid var(--line);border-radius:7px;color:#56617a;background:#fbfcff;font-size:9px}
@media(max-width:900px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shift-layout{grid-template-columns:1fr}.shift-row{grid-template-columns:1fr 1fr}.passenger-result{grid-template-columns:42px 1fr}.passenger-tickets{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:560px){.stats-grid{grid-template-columns:1fr 1fr;gap:8px}.shift-cash-grid{grid-template-columns:1fr}.shift-current-status{align-items:flex-start;flex-direction:column}.shift-actions{flex-direction:column}.shift-actions .button{width:100%}.passenger-result{padding:12px}.notification-summary-row{gap:8px}}


/* v49 — Clear readable three-dot menu labels */
body.authenticated .ref-public-menu-panel{
  width:280px!important;
  padding:10px!important;
}
body.authenticated .ref-public-menu-panel button{
  min-height:46px!important;
  height:46px!important;
  padding:6px 9px!important;
  gap:10px!important;
  font-size:13px!important;
  font-weight:750!important;
  line-height:1.25!important;
  overflow:visible!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon{
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  flex:0 0 32px!important;
}
body.authenticated .ref-public-menu-panel button .menu-label{
  min-width:0!important;
  min-height:32px!important;
  font-size:13px!important;
  font-weight:750!important;
  line-height:1.25!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
body.authenticated .ref-menu-section{
  font-size:8px!important;
  line-height:1.2!important;
  padding:6px 6px 3px!important;
}
@media(max-width:760px){
  body.authenticated .ref-public-menu-panel{
    width:270px!important;
    padding:8px!important;
  }
  body.authenticated .ref-public-menu-panel button{
    min-height:45px!important;
    height:45px!important;
    padding:6px 8px!important;
    gap:9px!important;
    font-size:12px!important;
  }
  body.authenticated .ref-public-menu-panel button .menu-icon{
    width:31px!important;
    height:31px!important;
    min-width:31px!important;
    flex-basis:31px!important;
  }
  body.authenticated .ref-public-menu-panel button .menu-label{
    font-size:12px!important;
    line-height:1.25!important;
  }
  body.authenticated .ref-menu-section{
    font-size:7.5px!important;
  }
}


/* v50 — Keep three-dot menu labels inside their row and clear of icons */
body.authenticated .ref-public-menu-panel button{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
body.authenticated .ref-public-menu-panel button .menu-icon{
  flex:0 0 32px!important;
  width:32px!important;
  min-width:32px!important;
  max-width:32px!important;
  box-sizing:border-box!important;
}
body.authenticated .ref-public-menu-panel button .menu-label{
  flex:1 1 auto!important;
  width:auto!important;
  min-width:0!important;
  max-width:calc(100% - 42px)!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
  display:block!important;
  line-height:32px!important;
  padding:0!important;
  margin:0!important;
}
@media(max-width:760px){
  body.authenticated .ref-public-menu-panel button .menu-icon{
    flex-basis:31px!important;
    width:31px!important;
    min-width:31px!important;
    max-width:31px!important;
  }
  body.authenticated .ref-public-menu-panel button .menu-label{
    max-width:calc(100% - 40px)!important;
    line-height:31px!important;
  }
}


/* Login copy/readability: keep Bangla conjuncts intact and allow full guidance on small screens. */
#loginScreen:lang(bn) :is(.jpl-hero-copy h1, .jpl-hero-kicker, .jpl-live-badge, .jpl-access-label, .jpl-welcome h2, .jpl-login-head h2) {
  letter-spacing: normal;
}
body.login-open #loginScreen:lang(bn) .jpl-hero-copy h1 { line-height: 1.3 !important; }
.jpl-welcome h2 [data-login-copy="welcome"] { font-size: inherit; }
.jpl-login-head > div, .jpl-field, .jpl-login-help { min-width: 0; }
#loginScreen .jpl-login-head p { font-size: 12px; line-height: 1.8; }
.jpl-login-help {
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid #dce9f5;
  border-radius: 8px;
  background: #f5f9fd;
  color: #36516b;
  line-height: 1.85;
  overflow-wrap: break-word;
  word-break: normal;
}
.jpl-login-help p { margin: 0; font-size: 12px; }
.jpl-login-help p:first-child { margin-bottom: 6px; color: #1c405f; font-size: 13px; font-weight: 700; }
#loginScreen .jpl-field > span:first-child { font-size: 13px; line-height: 1.7; }
#loginScreen .jpl-input input { font-size: 13px; }
#loginScreen .jpl-role-choice { line-height: 1.6; }
#loginScreen .jpl-check, #loginScreen .jpl-login-row .text-button { font-size: 12px; line-height: 1.7; }
#loginScreen .login-error, #loginScreen .shared-auth-note { font-size: 12px; font-weight: 500; line-height: 1.85; }
#loginScreen .shared-auth-note { align-items: flex-start; }
#loginScreen .shared-auth-note > i { margin-top: 4px; }
#loginScreen .shared-auth-note > span { min-width: 0; flex: 1 1 160px; }
#loginScreen .shared-auth-note small { display: block; margin-top: 5px; font-size: inherit; }
#loginScreen .shared-auth-note .text-button { min-height: 36px; margin-left: 22px; font-size: 12px; line-height: 1.7; text-align: left; }
#loginScreen .jpl-footer p { font-size: 11px; line-height: 1.8; }

/* Login help dialogs must appear above the fixed login screen. */
body.login-open .modal { z-index: 1100; }
body.login-open .toast { z-index: 1200; }
body.login-open .simple-modal p { line-height: 1.85; overflow-wrap: break-word; }