/* REV mobile design option 1 — presentation-only layer.
   Intentionally changes no IDs, DOM structure, event handlers, API calls or navigation logic. */
:root{
  --rev-o1-blue:#0e8bd0;--rev-o1-blue-dark:#0a6a96;--rev-o1-ink:#172B3A;
  --rev-o1-muted:#64748B;--rev-o1-border:#DCE5EF;--rev-o1-surface:#F2F6FA;
  --rev-o1-white:#FFFFFF;--rev-o1-shadow:0 8px 24px rgba(23,43,58,.08);
}
html{color-scheme:light}
body{background:var(--rev-o1-surface);color:var(--rev-o1-ink);font-family:Vazirmatn,Vazir,Tahoma,sans-serif}
button,input,select,textarea{font-family:inherit}
button,a,[role=button]{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(14,139,208,.35);outline-offset:2px}
button{transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease}
button:active{transform:translateY(1px)}
/* Primary actions share one calm blue, without touching disabled/hidden state. */
button.primary,.primary-btn,.btn-primary,.search-go,#searchSubmit,#routeToggle,.route-submit{
 background:var(--rev-o1-blue);border-color:var(--rev-o1-blue);color:#fff
}
button.primary:hover,.primary-btn:hover,.btn-primary:hover,.search-go:hover,#searchSubmit:hover,#routeToggle:hover,.route-submit:hover{
 background:var(--rev-o1-blue-dark);border-color:var(--rev-o1-blue-dark)
}
input,select,textarea{border-color:var(--rev-o1-border);border-radius:12px}
input:focus,select:focus,textarea:focus{border-color:var(--rev-o1-blue);box-shadow:0 0 0 3px rgba(14,139,208,.12)}
/* Map page: white cards, spacious controls, clearer type. */
header{background:#fff;color:var(--rev-o1-ink);border-color:var(--rev-o1-border);box-shadow:0 2px 10px rgba(23,43,58,.035)}
header a{color:var(--rev-o1-blue)}
.title,h1,h2,h3,.title strong{color:var(--rev-o1-ink)}
.muted,.note,small{color:var(--rev-o1-muted)}
.actions button,.actions select,.filter-btn,.filter-menu button{min-height:42px;border-radius:12px;border-color:var(--rev-o1-border);background:#fff;color:var(--rev-o1-ink)}
.actions button.primary,.filter-btn.on,.filter-menu button.active{background:var(--rev-o1-blue);color:#fff;border-color:var(--rev-o1-blue)}
#map{border-radius:16px;border-color:var(--rev-o1-border)}
#details-panel,.detail-card,.search-history-panel,.filter-menu,.music-panel,#routePanel,.weather-main{
 background:#fff;border-color:var(--rev-o1-border);border-radius:18px;box-shadow:var(--rev-o1-shadow)
}
.detail-type{color:var(--rev-o1-blue-dark);background:#E8F5FA;border-color:#C8E7F0}
.map-search-bar,.map-search-form{border-radius:18px}
.map-search-form{border-color:var(--rev-o1-border);box-shadow:0 8px 24px rgba(23,43,58,.10)}
#placeSearch{min-height:44px;color:var(--rev-o1-ink)}
#locate,#searchSubmit,.map-search-bar button,.filter-btn{min-width:44px;min-height:44px}
.bottom-nav{background:rgba(255,255,255,.97);border-top:1px solid var(--rev-o1-border);box-shadow:0 -5px 22px rgba(23,43,58,.07);padding-bottom:env(safe-area-inset-bottom)}
.bottom-nav-inner{max-width:720px;margin-inline:auto}
.bottom-nav a{min-height:54px;color:var(--rev-o1-muted);border-radius:13px}
.bottom-nav a.active{color:var(--rev-o1-blue);background:#EAF6FA}
.bottom-nav a.active svg{color:var(--rev-o1-blue)}
/* App landing pages: retain existing component structure and behavior. */
#onboard,.ob-card,#revAccountCard{color:var(--rev-o1-ink)}
.ob-card,#revAccountCard{border-color:var(--rev-o1-border);border-radius:24px;box-shadow:var(--rev-o1-shadow)}
.ob-card button,#revAccountCard button,#revAccountCard a{border-radius:14px}
@media(max-width:700px){
 body{padding-bottom:calc(78px + env(safe-area-inset-bottom))}
 header{padding:12px 14px}
 main{width:calc(100% - 12px);margin:6px auto 14px}
 .title{font-size:19px}
 .actions{gap:7px}
 .actions button,.actions select{min-height:42px;padding:8px 11px;font-size:13px}
 /* Keep the existing full-screen map and overlay layout intact on mobile. */
 #map{border-radius:16px}
 #details-panel{padding:16px}
 .bottom-nav a{font-size:12px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}


/* Option 1 — stronger mobile overrides for the existing full-screen app.
   These target the actual map controls and beat legacy inline !important rules;
   layout, IDs, handlers, APIs and feature visibility remain unchanged. */
:root{
 --rev-o1-blue:#2563EB;--rev-o1-blue-dark:#1D4ED8;
 --rev-o1-surface:#F4F7FB;--rev-o1-border:#D9E2EF;
 --rev-o1-ink:#172B4D;--rev-o1-muted:#64748B;
}
.map-search-form{
 background:#FFFFFF!important;border:1px solid #D9E2EF!important;
 border-radius:20px!important;box-shadow:0 10px 30px rgba(23,43,77,.16)!important;
}
#placeSearch{color:#172B4D!important}
#placeSearch::placeholder{color:#7B8798!important}
#mapSearchBar button,#mapSearchBar .filter-btn,#locate,#routeToggle,#navRecenterFloat{
 background:#FFFFFF!important;color:#2563EB!important;border:1px solid #D9E2EF!important;
 border-radius:16px!important;box-shadow:0 6px 20px rgba(23,43,77,.14)!important;
}
#mapSearchBar button svg,#locate svg,#navRecenterFloat svg{stroke:#2563EB!important}
#routeToggle{background:#2563EB!important;color:#FFFFFF!important;border-color:#2563EB!important}
#routePanel{
 background:#FFFFFF!important;border:1px solid #D9E2EF!important;border-radius:24px!important;
 box-shadow:0 18px 50px rgba(23,43,77,.22)!important;color:#172B4D!important;
}
#routePanel .route-head{color:#172B4D!important}
#routePanel input,#routePanel select,#routePanel textarea{
 background:#F8FAFC!important;color:#172B4D!important;border:1px solid #D9E2EF!important;
 border-radius:13px!important;min-height:44px!important;
}
#routePanel button.route-submit,#routePanel .route-submit,
#routePanel button.primary{background:#2563EB!important;color:#FFFFFF!important;border-color:#2563EB!important}
#details-panel:not([hidden]){
 background:#FFFFFF!important;border:1px solid #D9E2EF!important;border-radius:24px!important;
 box-shadow:0 16px 40px rgba(23,43,77,.18)!important;color:#172B4D!important;
}
#details-drag-handle span{background:#B7C5D8!important}
.detail-type{background:#EFF6FF!important;color:#1D4ED8!important;border-color:#BFDBFE!important}
.filter-menu,.search-history-panel,.music-panel{
 background:#FFFFFF!important;border:1px solid #D9E2EF!important;
 border-radius:20px!important;box-shadow:0 14px 36px rgba(23,43,77,.18)!important;
}
.filter-menu button.active,.filter-menu button[aria-pressed="true"]{
 background:#2563EB!important;color:#FFFFFF!important;border-color:#2563EB!important;
}
.map-top-widgets .weather-widget,.map-top-widgets .music-launch{
 border-radius:16px!important;border-color:#D9E2EF!important;
 box-shadow:0 6px 20px rgba(23,43,77,.12)!important;
}
.bottom-nav{background:#FFFFFF!important;border-top:1px solid #D9E2EF!important}
.bottom-nav a.active{background:#EFF6FF!important;color:#2563EB!important}
@media(max-width:700px){
 .map-search-form{min-height:56px!important}
 #details-panel:not([hidden]){padding:16px!important}
 #routePanel{border-radius:22px!important}
}


/* REV MOBILE THEME LOCK v5 — enforce the agreed white + blue app palette
   across the home shell and map, overriding legacy page-level declarations. */
:root{
  color-scheme:light!important;
  --rev-blue:#2563EB;
  --rev-blue-dark:#1D4ED8;
  --rev-app-white:#FFFFFF;
  --rev-app-ink:#172B4D;
  --rev-app-muted:#64748B;
  --rev-app-border:#D9E2EF;
}
html,body,body.has-bottom-nav{
  background:#FFFFFF!important;
  color:var(--rev-app-ink)!important;
  color-scheme:light!important;
}
body,button,input,select,textarea{
  font-family:Vazirmatn,Vazir,Tahoma,sans-serif!important;
}
button.btn-primary,button.primary,.primary-btn,.btn-primary,
button[type=submit],#obSend,#obVerify,.ob-big-btn,
#searchSubmit,#routeToggle,#routePanel .route-submit,
button.route-submit{
  background:var(--rev-blue)!important;
  color:#FFFFFF!important;
  border-color:var(--rev-blue)!important;
}
button.btn-primary:hover,button.primary:hover,.primary-btn:hover,.btn-primary:hover,
button[type=submit]:hover,#obSend:hover,#obVerify:hover,
#routePanel .route-submit:hover,button.route-submit:hover{
  background:var(--rev-blue-dark)!important;
  border-color:var(--rev-blue-dark)!important;
}
input,select,textarea{
  background:#FFFFFF!important;
  color:var(--rev-app-ink)!important;
  border-color:var(--rev-app-border)!important;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--rev-blue)!important;
  box-shadow:0 0 0 3px rgba(37,99,235,.14)!important;
}
.ob-card,#revAccountCard,.card,.panel,.modal-content,
#details-panel:not([hidden]),#routePanel,.detail-card,
.search-history-panel,.filter-menu,.music-panel{
  background:#FFFFFF!important;
  color:var(--rev-app-ink)!important;
  border-color:var(--rev-app-border)!important;
}
.bottom-nav,.bottom-nav nav,.bottom-nav-inner{
  background:#FFFFFF!important;
  border-color:var(--rev-app-border)!important;
}
.bottom-nav a.active{
  color:var(--rev-blue)!important;
  background:#EFF6FF!important;
}
.bottom-nav a.active svg{color:var(--rev-blue)!important;stroke:var(--rev-blue)!important}
a{ -webkit-tap-highlight-color:rgba(37,99,235,.12); }
@media(max-width:700px){
  body.has-bottom-nav{background:#FFFFFF!important}
}

/* === REV Design 1 — Signature layer (v5) ===
   Visual language of "طرح ۱" (minimal modern): one calm accent, white surfaces,
   layered soft shadows instead of hard borders, large radii, capsule search,
   circular floating map buttons, ring gauges, hairline list rows.
   Reverse-engineered competitor points: Google Maps capsule search + filter chips
   and bottom-sheet depth; Waze circular floating actions; iOS-style grouped rows. */
:root{--rev-d1-accent:#0e8bd0;--rev-d1-accent-deep:#0a6a96;--rev-d1-ink:#172B3A;--rev-d1-muted:#64748B;--rev-d1-line:#E1EAF2;--rev-d1-shadow-soft:0 10px 30px rgba(23,43,58,.07);--rev-d1-shadow-lift:0 12px 32px rgba(23,43,58,.13)}
/* Cards & panels: rounder, softer, more air */
.card,.hero-card,.list-card,.ob-card{border-radius:20px!important;border-color:var(--rev-d1-line)!important;box-shadow:var(--rev-d1-shadow-soft)!important}
input,select,textarea{border-radius:12px!important;border-color:#DCE5EF!important}
/* Bottom tab bar: floating softness, active pill */
.bottom-nav{border-top:1px solid rgba(225,234,242,.7)!important;box-shadow:0 -8px 28px rgba(23,43,58,.08)!important}
.bottom-nav a{border-radius:14px!important}
.bottom-nav a.active,.bottom-nav a[aria-current="page"]{background:#EAF6FA!important;color:var(--rev-d1-accent)!important;font-weight:800}
/* Map: capsule search (Google Maps pattern) */
.map-search-bar{border-radius:999px!important;background:#fff!important;border:1px solid var(--rev-d1-line)!important;box-shadow:var(--rev-d1-shadow-lift)!important}
.map-search-form input{font-size:14px!important}
.search-go{border-radius:50%!important}
/* Map: circular floating buttons (Waze pattern) */
.map-top-widgets button,.rev-right-buttons button,.rev-right-buttons a,#routeSettingsToggle{border-radius:50%!important;background:#fff!important;border:1px solid #E7EEF5!important;box-shadow:0 6px 18px rgba(23,43,58,.12)!important}
.rev-weather{border-radius:18px!important;border-color:var(--rev-d1-line)!important;box-shadow:var(--rev-d1-shadow-soft)!important}
/* Guidance banner & nav dashboard: sheet depth */
#navBanner{border-radius:18px!important;border-color:var(--rev-d1-line)!important;box-shadow:var(--rev-d1-shadow-lift)!important}
#navDash{border-radius:20px 20px 0 0!important;box-shadow:0 -10px 30px rgba(23,43,58,.12)!important}
#routePanel{border-radius:22px!important;box-shadow:0 18px 44px rgba(23,43,58,.2)!important}
#rev-live-energy-advice{border-radius:18px!important;box-shadow:var(--rev-d1-shadow-lift)!important}
/* Energy assistant ring gauge (Design 1 signature) */
.soc-ring{background:conic-gradient(var(--rev-d1-accent) var(--soc-angle),#E9F1F7 var(--soc-angle))!important;width:124px!important;height:124px!important;box-shadow:0 12px 28px rgba(14,139,208,.15)}
/* Service rows: grouped-list look, generous touch height */
.row-item{min-height:60px!important;border-radius:18px!important}
.service-tabs button{border-radius:999px!important}
.chip,.filter-chip{border-radius:999px!important}
/* Station pins keep brand teal but gain the soft lifted shadow */
.rev-pin{box-shadow:0 8px 20px rgba(23,43,58,.22)!important}
/* Picker chips must stay light: the theme blanket button rule would paint them teal. */
.port-opt{background:#fff!important;color:#3c5266!important}
.port-opt.sel{background:#EAF7FB!important;border-color:var(--rev-d1-accent)!important}
.ra-conn{background:#fff!important;color:#14293b!important}
.ra-conn.sel{background:#DCF5E3!important;color:#11703C!important;border-color:#16A34A!important}
/* Icon & accent harmony (v6): one line-icon size in the tab bar, one accent for active filters */
.bottom-nav a svg{width:22px!important;height:22px!important}
.news-filter{border-radius:999px!important}
.news-filter.active{background:var(--rev-d1-accent)!important;border-color:var(--rev-d1-accent)!important;color:#fff!important}

/* === v7 — Palette & Type (Design 1, brighter azure + Vazirmatn) ===
   User lifted the old color lock (23 Oct): palette and type may change freely.
   Delivery fix: sw.js treats this file as always-fresh and shell version bumps,
   so design changes actually reach the device instead of dying in cache. */
@font-face{font-family:'Vazirmatn';src:url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/fonts/webfonts/Vazirmatn-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/fonts/webfonts/Vazirmatn-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/fonts/webfonts/Vazirmatn-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Vazirmatn';src:url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/fonts/webfonts/Vazirmatn-ExtraBold.woff2') format('woff2');font-weight:800;font-display:swap}
:root{
 --rev-o1-blue:#0E8BD0;--rev-o1-blue-dark:#0A6A96;
 --rev-d1-accent:#0E8BD0;--rev-d1-accent-deep:#0A6A96;
}
html,body,button,input,select,textarea{font-family:'Vazirmatn',Tahoma,sans-serif!important}
button.primary,.primary-btn,.btn-primary,.search-go,#searchSubmit,#routeToggle,.route-submit{
 background:linear-gradient(135deg,#0E8BD0,#0A6A96)!important;border-color:#0A6A96!important;color:#fff!important}
.bottom-nav a.active,.bottom-nav a[aria-current="page"]{background:#E9F5FC!important;color:#0E8BD0!important}
.port-opt.sel{background:#EAF6FD!important;border-color:#0E8BD0!important}
.news-filter.active{background:#0E8BD0!important;border-color:#0E8BD0!important}

/* === v8 — Hybrid build (user-approved 23 Oct) ===
   A skeleton · C dashboard touches · D energy accents · B night navigation.
   Rollback = remove this section. */
:root{--hyb-grad:linear-gradient(90deg,#7C5CFF,#0E8BD0);--hyb-grad135:linear-gradient(135deg,#7C5CFF,#0E8BD0)}
button.primary,.primary-btn,.btn-primary,.search-go,#searchSubmit,#routeToggle,.route-submit,.svc-btn{
 background:var(--hyb-grad)!important;border-color:#6A4DFF!important;color:#fff!important}
.news-hero{background:linear-gradient(140deg,#7C5CFF 0%,#0E8BD0 55%,#12B76A 115%)!important}
.user-avatar{background:var(--hyb-grad135)!important;color:#fff!important}
/* خدمات: کاشی‌های رنگی آیکون (D) */
.row-item .ico{width:46px;height:46px;border-radius:15px;background:#E9F5FC;display:inline-flex;align-items:center;justify-content:center;font-size:21px;flex:none}
.row-item:nth-child(4n+2) .ico{background:#EAFBF3}
.row-item:nth-child(4n+3) .ico{background:#FDF3E0}
.row-item:nth-child(4n+4) .ico{background:#F3EEFC}
/* خانه: کارت انرژی/سفر ترکیبی (تزریقی با rev-hybrid-home.js) */
#hybHomeCard{background:#fff;border-radius:24px;box-shadow:0 14px 34px rgba(16,42,67,.12);padding:15px 17px 17px;margin:14px 0 4px}
#hybHomeCard .hyb-energy{display:flex;align-items:center;gap:11px;padding-bottom:12px;border-bottom:1px solid #EEF3F7}
#hybHomeCard .hyb-ring{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none}
#hybHomeCard .hyb-ring i{width:41px;height:41px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#0A6A96;font-style:normal}
#hybHomeCard .hyb-energy b{font-size:14px;display:block;color:#172B3A}
#hybHomeCard .hyb-energy span{font-size:11.5px;color:#0E9F6E;font-weight:700}
#hybHomeCard .hyb-car{margin-inline-start:auto;text-align:left}
#hybHomeCard .hyb-car b{font-size:12.5px;color:#33566b}
#hybHomeCard .hyb-car span{color:#7d93a3;font-weight:400}
#hybHomeCard .hyb-trip{display:flex;align-items:center;justify-content:space-between;margin-top:12px}
#hybHomeCard .hyb-trip b{font-size:15px;color:#172B3A}
#hybHomeCard .hyb-eta{font-size:12px;font-weight:700;color:#6A4DFF;background:#EFEAFF;border-radius:999px;padding:5px 11px}
#hybHomeCard .hyb-route{display:flex;align-items:center;gap:9px;margin:11px 0 3px}
#hybHomeCard .hyb-route b{font-size:16px;color:#172B3A}
#hybHomeCard .hyb-line{flex:1;height:4px;border-radius:99px;background:linear-gradient(90deg,#FF7A59,#FFD166,#12B76A)}
#hybHomeCard .hyb-meta{display:flex;gap:14px;margin-top:8px;font-size:12.5px;color:#5b7689}
#hybHomeCard .hyb-meta b{color:#172B3A}
#hybHomeCard .hyb-go{margin-top:13px;width:100%;border:0;border-radius:16px;padding:14px;background:var(--hyb-grad);color:#fff;font-size:15.5px;font-weight:800;box-shadow:0 12px 26px rgba(110,90,240,.30);cursor:pointer}
/* B: مُد شب هنگام هدایت */
body.rev-navigating .leaflet-tile-pane{filter:invert(.92) hue-rotate(185deg) saturate(.55) brightness(.92)}
body.rev-navigating #navBanner,body.rev-navigating #navDash{
 background:rgba(13,26,36,.95)!important;color:#E9F2F7!important;
 border:1px solid rgba(120,200,240,.25)!important;box-shadow:0 16px 36px rgba(0,0,0,.45)!important}
body.rev-navigating #navBanner *,body.rev-navigating #navDash *{color:#DCEBF5!important}
body.rev-navigating #navDash strong,body.rev-navigating #navBanner strong{color:#39C2F0!important}
body.rev-navigating .bottom-nav{background:rgba(13,26,36,.96)!important;border-top:1px solid rgba(120,200,240,.18)!important}
body.rev-navigating .bottom-nav a{color:#7E9BAC!important}
body.rev-navigating .bottom-nav a.active{background:rgba(25,181,230,.16)!important;color:#39C2F0!important}
body.rev-navigating #revEnergyBanner{background:rgba(13,26,36,.95)!important;color:#E9F2F7!important;border-color:rgba(120,200,240,.3)!important}
/* v8.1 — جزئیات مُد شب: آیکون مانور، خطوط راهنما، پیشرفت و کارت‌های داشبورد */
body.rev-navigating .nav-maneuver-icon{background:linear-gradient(135deg,#19B5E6,#0A6A96)!important;color:#fff!important}
body.rev-navigating .nav-maneuver-dist,body.rev-navigating .nav-maneuver-instr,body.rev-navigating .nav-maneuver-next{background:transparent!important}
body.rev-navigating #navDist{color:#39C2F0!important}
body.rev-navigating .rev-nav-progress{background:rgba(255,255,255,.14)!important}
body.rev-navigating #navProgressFill{background:linear-gradient(90deg,#19B5E6,#2BD98A)!important}
body.rev-navigating .env-line{background:rgba(255,255,255,.06)!important;color:#BFE6FA!important}
body.rev-navigating [class*="nav-dash"]{background:rgba(255,255,255,.06)!important;color:#DCEBF5!important}
/* v8.2 — آیکون مانور و کارت‌های آمار در مُد شب (ویژه‌گی ID برای غلبه بر استایل‌های ویز) */
body.rev-navigating #navIcon{background:linear-gradient(135deg,#19B5E6,#0A6A96)!important;color:#fff!important}
body.rev-navigating .nav-stat{background:rgba(255,255,255,.07)!important;border-color:rgba(120,200,240,.22)!important}