/* =====================================================
   EV-Ran Premium Charging UI
   ===================================================== */

:root {
  --bg:#050b14;
  --bg2:#081522;
  --card:rgba(14,28,45,.88);
  --border:rgba(255,255,255,.08);

  --accent:#00e5a8;
  --blue:#00b8ff;
  --green:#00e676;
  --danger:#ff453a;

  --text:#f5f7fa;
  --muted:#93a4b8;
}


body {
  background:
    radial-gradient(
      circle at top,
      rgba(0,229,168,.15),
      transparent 35%
    ),
    var(--bg);

  color:var(--text);
}


/* HEADER */

.evran-header {

  display:flex;
  align-items:center;
  padding:18px 18px;

  gap:12px;

}


.evran-back {

  color:white;
  font-size:32px;
  text-decoration:none;

}


.evran-brand {

 display:flex;
 align-items:center;
 gap:10px;

}


.evran-brand img {

 width:125px;
 height:auto;
 max-height:none;
 object-fit:contain;
 display:block;

}


.evran-brand-name {

 font-size:18px;
 font-weight:800;

}


.evran-brand-sub {

 font-size:9px;
 color:var(--muted);

}


.evran-live {

 margin-left:auto;

 background:rgba(0,229,168,.12);

 color:var(--accent);

 padding:7px 12px;

 border-radius:20px;

 font-size:11px;

 font-weight:700;

}


.live-dot {

 display:inline-block;

 width:7px;
 height:7px;

 border-radius:50%;

 background:var(--accent);

 margin-right:5px;

}


/* PAGE */

.evran-page {

 padding:10px 18px 30px;

}


/* CHARGER */

.evran-charger {

 text-align:center;

 margin-bottom:18px;

}


.charger-status {

 color:var(--accent);

 font-size:13px;

}


.status-pulse {

 display:inline-block;

 width:8px;
 height:8px;

 background:var(--accent);

 border-radius:50%;

 margin-right:5px;

}


.charger-name {

 margin-top:8px;

 font-size:20px;

 font-weight:800;

}


/* POWER */

.power-card {

 position:relative;

 overflow:hidden;

 background:linear-gradient(
  145deg,
  rgba(0,229,168,.12),
  rgba(0,184,255,.08)
 );

 border:1px solid var(--border);

 border-radius:28px;

 padding:32px 20px;

 text-align:center;

}


.power-card-glow {

 position:absolute;

 width:180px;
 height:180px;

 background:rgba(0,229,168,.2);

 filter:blur(60px);

 top:-50px;
 left:50%;

 transform:translateX(-50%);

}


.power-label {

 color:var(--muted);

 font-size:13px;

}


.power-value-row {

 display:flex;

 justify-content:center;

 align-items:end;

 gap:8px;

 margin-top:10px;

}


.power-value {

 font-size:58px;

 font-weight:900;

 letter-spacing:-2px;

}


.power-unit {

 font-size:18px;

 color:var(--muted);

 margin-bottom:10px;

}


.power-line {

 margin:20px auto;

 width:70%;

 height:2px;

 background:linear-gradient(
 90deg,
 transparent,
 var(--accent),
 transparent
 );

}


.charging-indicator {

 color:var(--accent);

 font-size:14px;

}


/* BATTERY */

.battery-card,
.billing-card,
.stat-card {

 background:var(--card);

 border:1px solid var(--border);

 border-radius:22px;

}


.battery-card {

 padding:20px;

 margin-top:16px;

}


.section-heading {

 display:flex;

 justify-content:space-between;

}


.section-title {

 font-weight:700;

}


.section-caption {

 font-size:12px;

 color:var(--muted);

}


.soc-number {

 font-size:26px;

 font-weight:900;

}


.battery-track {

 height:12px;

 background:#16283c;

 border-radius:20px;

 overflow:hidden;

 margin-top:18px;

}


.battery-fill {

 height:100%;

 background:linear-gradient(
 90deg,
 var(--green),
 var(--accent)
 );

 border-radius:20px;

}


.battery-footer {

 margin-top:10px;

 display:flex;

 justify-content:space-between;

 color:var(--muted);

 font-size:12px;

}


/* STATS */

.stats-grid {

 display:grid;

 grid-template-columns:1fr 1fr;

 gap:12px;

 margin-top:14px;

}


.stat-card {

 padding:18px;

 display:flex;

 gap:10px;

}


.stat-icon {

 font-size:24px;

}


.stat-label {

 color:var(--muted);

 font-size:12px;

}


.stat-value-row strong,
.stat-time {

 font-size:22px;

}


/* BILLING */

.billing-card {

 margin-top:14px;

 padding:20px;

}


.billing-header {

 display:flex;

 justify-content:space-between;

}


.billing-title {

 display:flex;

 gap:10px;

}


.billing-title small {

 display:block;

 color:var(--muted);

}


.rate-badge {

 color:var(--accent);

 font-size:11px;

}


.billing-main {

 margin-top:20px;

 display:flex;

 justify-content:space-between;

 align-items:center;

}


.billing-price strong {

 font-size:30px;

}


/* WALLET */

.wallet-card {

 margin-top:18px;

 padding:18px;

 background:rgba(0,229,168,.08);

 border:1px solid rgba(0,229,168,.2);

 border-radius:18px;

}


.wallet-top {

 display:flex;

 justify-content:space-between;

}


.wallet-balance-row {

 margin-top:10px;

}


.wallet-balance-row strong {

 font-size:30px;

}


.wallet-warning {

 color:#ffb74d;

}


/* STOP */

.evran-stop {

 width:100%;

 margin-top:20px;

 padding:17px;

 border-radius:18px;

 border:0;

 background:linear-gradient(
 135deg,
 #ff453a,
 #b91c1c
 );

 color:white;

 font-size:17px;

 font-weight:800;

}


.stop-hint {

 text-align:center;

 color:var(--muted);

 font-size:11px;

 margin-top:12px;

}


.evran-session-id {

 display:none;

}

/* =========================================================
   EV-Ran Typography Standard
   2026-09-03
   ========================================================= */

/* Bottom Navigation */
.evran-bottom .evran-nav-item{
    font-size:11px !important;
    gap:5px !important;
}

.evran-bottom .evran-nav-icon{
    font-size:20px !important;
    line-height:22px !important;
}

.evran-bottom .evran-nav-charge{
    font-size:27px !important;
}

/* General readable small text */
.evran-container small,
.evran-container .small,
.evran-container [class*="subtitle"],
.evran-container [class*="hint"],
.evran-container [class*="description"]{
    font-size:11px;
}

/* Form labels */
.evran-container label{
    font-size:12px;
}

/* Buttons */
.evran-container button,
.evran-container .btn{
    font-size:13px;
}

/* Cards */
.evran-container .card-title,
.evran-container [class*="card-title"]{
    font-size:14px;
}

/* Better mobile readability */
@media (max-width:480px){
    .evran-bottom .evran-nav-item{
        font-size:11px !important;
    }
}


/* =========================================================
   EV-Ran — Global Bottom Navigation Typography
   ========================================================= */

.evran-bottom .evran-nav-item,
.evran-bottom-inner .evran-nav-item{
    font-size:12px !important;
    line-height:1.35 !important;
    font-weight:500 !important;
    gap:5px !important;
}

.evran-bottom .evran-nav-item span:not(.evran-nav-charge),
.evran-bottom-inner .evran-nav-item span:not(.evran-nav-charge){
    font-size:12px !important;
    line-height:1.35 !important;
}

.evran-bottom .evran-nav-icon,
.evran-bottom-inner .evran-nav-icon{
    font-size:20px !important;
    line-height:22px !important;
}

.evran-bottom .evran-nav-charge,
.evran-bottom-inner .evran-nav-charge{
    font-size:27px !important;
}


/* =========================================================
   EV-RAN / MAPLIBRE FINAL INTERACTION FIX
   ========================================================= */

/* MapLibre charger markers must receive pointer events */
.maplibregl-marker.charger-marker-wrap {
  pointer-events: auto !important;
  z-index: 1700 !important;
  cursor: pointer !important;
}

.charger-marker-wrap {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Floating location button */
.evran-map-locate {
  position: absolute !important;
  z-index: 1800 !important;
  right: 14px !important;
  top: 126px !important;
  width: 46px !important;
  height: 46px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 14px !important;
  background: rgba(16,23,21,.94) !important;
  color: #20e58a !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 25px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.28) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

/* Sheet must be above MapLibre canvas and markers */
.map-bottom-sheet {
  position: absolute !important;
  z-index: 2000 !important;
  pointer-events: none !important;
  opacity: 0;
  transform: translateY(110%);
  transition: transform .25s ease, opacity .25s ease;
}

.map-bottom-sheet.open {
  z-index: 2000 !important;
  pointer-events: auto !important;
  opacity: 1;
  transform: translateY(0);
}

/* MapLibre itself */
.maplibregl-map {
  position: absolute;
  inset: 0;
}


/* =========================================================
   EV-RAN SHEET READABILITY
   ========================================================= */

.map-bottom-sheet {
  background: #081522 !important;
  color: #f5f7fa !important;
  border-top: 1px solid rgba(255,255,255,.12) !important;
}

.map-bottom-sheet .sheet-charger-name {
  color: #f5f7fa !important;
}

.map-bottom-sheet .sheet-charger-addr {
  color: #aeb8c2 !important;
}

.map-bottom-sheet .map-popup-dist {
  color: #00e5a8 !important;
}

.map-bottom-sheet .sheet-connector-list {
  color: #f5f7fa !important;
}

.map-bottom-sheet .sheet-btn-nav {
  background: #00e5a8 !important;
  color: #04130b !important;
}

.map-bottom-sheet .sheet-handle {
  background: #53616d !important;
}


/* =========================================================
   EV-RAN PREMIUM CHARGER DETAIL SHEET V2
   ========================================================= */

.evran-sheet-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:16px;
}

.evran-sheet-close{
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#f5f7fa;
  font-size:24px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  flex-shrink:0;
}

.evran-sheet-close:hover{
  background:rgba(255,255,255,.12);
}


.evran-sheet-title-wrap{
  min-width:0;
  flex:1;
}

.evran-sheet-favorite{
  width:40px;
  height:40px;
  flex-shrink:0;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#aeb8c2;
  font-size:24px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:
    background .18s ease,
    color .18s ease,
    border-color .18s ease,
    transform .18s ease;
}

.evran-sheet-favorite:hover{
  background:rgba(255,255,255,.12);
}

.evran-sheet-favorite:active{
  transform:scale(.92);
}

.evran-sheet-favorite.active{
  background:rgba(32,229,138,.12);
  border-color:rgba(32,229,138,.35);
  color:#20e58a;
}

.evran-sheet-title{
  color:#f5f7fa;
  font-size:18px;
  line-height:1.35;
  font-weight:800;
  margin-bottom:5px;
}

.evran-sheet-address{
  color:#aeb8c2;
  font-size:12px;
  line-height:1.5;
}

.evran-sheet-status{
  flex-shrink:0;
  display:flex;
  align-items:center;
  gap:6px;
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
  padding:6px 9px;
  border-radius:10px;
  background:rgba(32,229,138,.08);
}

.evran-sheet-specs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:18px;
}

.evran-sheet-spec{
  background:#0d1d2b;
  border:1px solid rgba(255,255,255,.08);
  border-radius:13px;
  padding:12px;
}

.evran-sheet-spec span{
  display:block;
  color:#8f9ca8;
  font-size:11px;
  margin-bottom:5px;
}

.evran-sheet-spec strong{
  display:block;
  color:#f5f7fa;
  font-size:14px;
  font-weight:800;
}

.evran-sheet-section-title{
  color:#f5f7fa;
  font-size:13px;
  font-weight:800;
  margin-bottom:9px;
}

.evran-sheet-connectors{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.evran-connector-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:13px;
  border-radius:16px;
  background:linear-gradient(135deg,#102334 0%,#0d1d2b 100%);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 5px 16px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.025);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.evran-connector-card:hover{
  border-color:rgba(32,229,138,.18);
  box-shadow:0 7px 20px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.03);
}

.evran-connector-main{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.evran-connector-icon{
  width:42px;
  height:42px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:rgba(0,229,168,.10);
  border:1px solid rgba(32,229,138,.12);
  color:#00e5a8;
  font-size:19px;
  box-shadow:0 4px 12px rgba(0,0,0,.12);
}

.evran-connector-info{
  min-width:0;
}

.evran-connector-title{
  color:#f5f7fa;
  font-size:14px;
  font-weight:900;
  line-height:1.35;
}

.evran-connector-sub{
  color:#8f9ca8;
  font-size:11px;
  margin-top:4px;
  line-height:1.5;
}

.evran-connector-right{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}

.evran-connector-status{
  display:flex;
  align-items:center;
  gap:5px;
  color:#aeb8c2;
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
}

.evran-sheet-start{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:38px;
  padding:7px 12px;
  border:0;
  border-radius:9px;
  background:#00e5a8;
  color:#04130b !important;
  font-size:12px;
  font-weight:800;
  line-height:1;
  text-decoration:none !important;
  white-space:nowrap;
  font-family:inherit;
  cursor:pointer;
}

.evran-sheet-start .evran-qr-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  font-size:21px;
  font-weight:900;
  line-height:1;
}

.evran-sheet-actions{
  display:flex;
  margin-top:13px;
}

.evran-sheet-nav{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:11px;
  border-radius:11px;
  background:#162936;
  border:1px solid rgba(255,255,255,.08);
  color:#f5f7fa !important;
  text-decoration:none !important;
  font-size:12px;
  font-weight:800;
}

.evran-sheet-empty{
  padding:15px;
  border-radius:12px;
  background:#0d1d2b;
  color:#8f9ca8;
  text-align:center;
  font-size:12px;
}


.evran-sheet-start{
  direction:rtl !important;
}

.evran-sheet-start > span{
  direction:rtl !important;
  unicode-bidi:plaintext !important;
  text-align:right !important;
  display:inline-block;
}

.evran-site-title{
  color:#f5f7fa;
  font-size:15px;
  font-weight:800;
  margin:18px 0 12px;
}

.evran-site-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:18px;
}

.evran-site-item{
  background:#102334;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  padding:14px 10px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#f5f7fa;
  font-size:13px;
  font-weight:700;
}

.evran-site-item:first-line{
  font-size:22px;
}



.evran-site-hero{
  width:100%;
  height:170px;
  border-radius:22px;
  overflow:hidden;
  margin-bottom:16px;
  position:relative;
  background:#102334;
  border:1px solid rgba(255,255,255,.08);
}

.evran-site-hero img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.evran-site-placeholder{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#20e58a;
  font-weight:800;
  font-size:18px;
}

.evran-site-placeholder div{
  font-size:48px;
}


/* =========================================
   EV-Ran Site Gallery
   ========================================= */

.evran-gallery{
  position:relative;
  width:100%;
  height:170px;
  overflow:hidden;
  border-radius:22px;
  background:#102334;
  border:1px solid rgba(255,255,255,.08);
  isolation:isolate;
}

.evran-gallery-slide{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
}

.evran-gallery-slide img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  background:#102334;
  padding:6px;
  box-sizing:border-box;
  user-select:none;
  -webkit-user-drag:none;
}

.evran-gallery-arrow{
  position:absolute;
  top:50%;
  z-index:5;
  width:38px;
  height:38px;
  margin:0;
  padding:0;
  transform:translateY(-50%);
  border:1px solid rgba(255,255,255,.18);
  border-radius:50%;
  background:rgba(0,0,0,.42);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  color:#fff;
  font-size:30px;
  line-height:32px;
  font-family:Arial,sans-serif;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:
    background .18s ease,
    transform .18s ease,
    border-color .18s ease;
}

.evran-gallery-arrow:hover{
  background:rgba(0,0,0,.62);
  border-color:rgba(32,229,138,.55);
}

.evran-gallery-arrow:active{
  transform:translateY(-50%) scale(.94);
}

.evran-gallery-prev{
  left:12px;
}

.evran-gallery-next{
  right:12px;
}

.evran-gallery-dots{
  position:absolute;
  z-index:6;
  left:50%;
  bottom:10px;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:5px 9px;
  border-radius:20px;
  background:rgba(0,0,0,.38);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.evran-gallery-dot{
  width:7px;
  height:7px;
  margin:0;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.45);
  cursor:pointer;
  transition:
    width .18s ease,
    background .18s ease,
    transform .18s ease;
}

.evran-gallery-dot.active{
  width:18px;
  border-radius:10px;
  background:#20e58a;
}

.evran-gallery-dot:active{
  transform:scale(.9);
}

/* Keep the existing placeholder visually consistent. */
.evran-gallery + .evran-sheet-header{
  margin-top:0;
}

@media (max-width:480px){
  .evran-gallery{
    height:170px;
    border-radius:22px;
  }

  .evran-gallery-arrow{
    width:34px;
    height:34px;
    font-size:27px;
  }

  .evran-gallery-prev{
    left:9px;
  }

  .evran-gallery-next{
    right:9px;
  }

  .evran-gallery-dots{
    bottom:8px;
  }
}


/* =====================================================
   EV-RAN SAFE SHEET INTERNAL SCROLL
   only affects charger sheet
   ===================================================== */

#charger-sheet {
  max-height: 82vh !important;
  overflow: hidden !important;
}

#charger-sheet #sheet-content {
  max-height: calc(82vh - 45px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch !important;
  padding-bottom: 30px !important;
}


.evran-marker-soc{
  position:absolute;
  left:50%;
  bottom:38px;
  transform:translateX(-50%);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  height:20px;
  padding:0 7px;
  border-radius:10px;
  background:#102334;
  border:1px solid rgba(32,229,138,.45);
  color:#20e58a;
  box-shadow:0 4px 12px rgba(0,0,0,.28);
  font-size:9px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
  pointer-events:none;
  direction:ltr;
}


/* =========================================================
   EV-RAN STATION SHEET — COMPACT PREMIUM OVERRIDE
   ========================================================= */

.evran-sheet-header{
  align-items:center;
  gap:10px;
  margin-bottom:12px;
}

.evran-sheet-title{
  font-size:17px;
  line-height:1.4;
  margin-bottom:3px;
}

.evran-sheet-address{
  font-size:11px;
  line-height:1.45;
  color:#98a6b2;
}

.evran-sheet-close{
  width:34px;
  height:34px;
  font-size:21px;
}

.evran-sheet-favorite{
  width:36px;
  height:36px;
  border-radius:10px;
  font-size:21px;
}

.evran-sheet-status{
  padding:5px 8px;
  border-radius:9px;
  font-size:10px;
}

.evran-sheet-specs{
  gap:8px;
  margin-bottom:14px;
}

.evran-sheet-spec{
  padding:10px 12px;
  border-radius:12px;
}

.evran-sheet-spec span{
  font-size:10px;
  margin-bottom:3px;
}

.evran-sheet-spec strong{
  font-size:13px;
}

/* Compact amenities */

.evran-site-title{
  font-size:12px;
  margin:14px 0 7px;
}

.evran-site-grid{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:14px;
}

.evran-site-item{
  flex:0 0 auto;
  min-height:32px;
  padding:6px 9px;
  border-radius:9px;
  flex-direction:row;
  gap:5px;
  font-size:10px;
  font-weight:700;
  background:#102334;
}

.evran-site-item span:first-child{
  font-size:14px;
  line-height:1;
}

.evran-site-item span:last-child{
  white-space:nowrap;
}

/* Section titles */

.evran-sheet-section-title{
  font-size:12px;
  margin-bottom:7px;
}

/* Connector cards slightly tighter */

.evran-sheet-connectors{
  gap:7px;
}

.evran-connector-card{
  padding:10px 11px;
  border-radius:14px;
}

.evran-connector-icon{
  width:38px;
  height:38px;
  border-radius:11px;
  font-size:17px;
}

.evran-connector-title{
  font-size:13px;
}

.evran-connector-sub{
  font-size:10px;
  margin-top:2px;
}

.evran-connector-status{
  font-size:9px;
}

.evran-sheet-actions{
  margin-top:10px;
}

.evran-sheet-nav{
  padding:10px;
  border-radius:10px;
  font-size:11px;
}


/* Connector port icons */
.evran-connector-icon svg{
  display:block;
  width:28px;
  height:28px;
  color:#00e5a8;
}


/* External connector SVG icons */
.evran-connector-icon .evran-connector-svg{
  display:block;
  width:28px;
  height:28px;
  object-fit:contain;
  flex:0 0 28px;
}


/* =========================================================
   EV-RAN PREMIUM GLASS STATION SHEET V3
   ========================================================= */

#charger-sheet{
  left:10px !important;
  right:10px !important;
  bottom:10px !important;

  border-radius:28px !important;

  background:
    linear-gradient(
      145deg,
      rgba(8,24,37,.92),
      rgba(7,19,30,.86)
    ) !important;

  border:1px solid rgba(255,255,255,.14) !important;

  box-shadow:
    0 24px 70px rgba(0,0,0,.48),
    0 8px 28px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.08) !important;

  backdrop-filter:blur(22px) saturate(135%) !important;
  -webkit-backdrop-filter:blur(22px) saturate(135%) !important;

  overflow:hidden !important;
}

/* subtle glass highlight */
#charger-sheet::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;

  background:
    radial-gradient(
      circle at 15% 0%,
      rgba(32,229,138,.10),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      rgba(255,255,255,.035),
      transparent 24%
    );

  border-radius:inherit;
}

/* sheet content */
#charger-sheet #sheet-content{
  position:relative;
  z-index:1;

  padding:18px 18px 26px !important;

  max-height:calc(82vh - 45px) !important;

  overflow-y:auto !important;
  overflow-x:hidden !important;

  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:none;
}

#charger-sheet #sheet-content::-webkit-scrollbar{
  display:none;
}

/* handle */
#charger-sheet .sheet-handle{
  width:42px !important;
  height:4px !important;

  margin:8px auto 4px !important;

  border-radius:999px !important;

  background:rgba(255,255,255,.24) !important;
}

/* header */
#charger-sheet .evran-sheet-header{
  margin-bottom:14px !important;
  gap:10px !important;
}

/* close button */
#charger-sheet .evran-sheet-close{
  width:38px !important;
  height:38px !important;

  border-radius:14px !important;

  background:rgba(255,255,255,.055) !important;
  border:1px solid rgba(255,255,255,.11) !important;

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 5px 16px rgba(0,0,0,.18);
}

/* title */
#charger-sheet .evran-sheet-title{
  font-size:18px !important;
  font-weight:850 !important;
  letter-spacing:-.2px;
}

/* address */
#charger-sheet .evran-sheet-address{
  color:#9eacb9 !important;
  font-size:11px !important;
}

/* status badge */
#charger-sheet .evran-sheet-status{
  padding:5px 9px !important;

  border-radius:999px !important;

  background:rgba(32,229,138,.09) !important;
  border:1px solid rgba(32,229,138,.18) !important;

  box-shadow:
    0 4px 14px rgba(0,0,0,.12),
    inset 0 1px 0 rgba(255,255,255,.04);
}

/* favorite */
#charger-sheet .evran-sheet-favorite{
  width:38px !important;
  height:38px !important;

  border-radius:14px !important;

  background:rgba(255,255,255,.055) !important;
  border:1px solid rgba(255,255,255,.11) !important;

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

/* specification cards */
#charger-sheet .evran-sheet-specs{
  gap:9px !important;
  margin-bottom:15px !important;
}

#charger-sheet .evran-sheet-spec{
  position:relative;

  padding:11px 12px !important;

  border-radius:16px !important;

  background:
    linear-gradient(
      145deg,
      rgba(20,45,61,.72),
      rgba(11,29,43,.66)
    ) !important;

  border:1px solid rgba(255,255,255,.09) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 7px 18px rgba(0,0,0,.12);

  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

#charger-sheet .evran-sheet-spec span{
  color:#899aa8 !important;
  font-size:9px !important;
}

#charger-sheet .evran-sheet-spec strong{
  color:#f5f7fa !important;
  font-size:14px !important;
}

/* section titles */
#charger-sheet .evran-sheet-section-title{
  color:#dce5eb !important;
  font-size:12px !important;
  font-weight:850 !important;

  margin-top:14px !important;
  margin-bottom:8px !important;
}

/* amenities */
#charger-sheet .evran-site-grid{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;

  margin-bottom:13px !important;
}

#charger-sheet .evran-site-item{
  min-height:30px !important;

  padding:5px 9px !important;

  border-radius:999px !important;

  background:rgba(17,39,53,.72) !important;
  border:1px solid rgba(255,255,255,.075) !important;

  color:#b8c5ce !important;

  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035);
}

/* connector cards */
#charger-sheet .evran-sheet-connectors{
  gap:8px !important;
}

#charger-sheet .evran-connector-card{
  padding:11px !important;

  border-radius:17px !important;

  background:
    linear-gradient(
      145deg,
      rgba(18,42,56,.78),
      rgba(10,27,40,.72)
    ) !important;

  border:1px solid rgba(255,255,255,.09) !important;

  box-shadow:
    0 8px 22px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.035);

  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

/* connector icon glass box */
#charger-sheet .evran-connector-icon{
  width:42px !important;
  height:42px !important;

  border-radius:13px !important;

  background:
    linear-gradient(
      145deg,
      rgba(32,229,138,.10),
      rgba(32,229,138,.035)
    ) !important;

  border:1px solid rgba(32,229,138,.16) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04);
}

/* SVG inside icon */
#charger-sheet .evran-connector-icon .evran-connector-svg{
  width:29px !important;
  height:29px !important;
}

/* connector title */
#charger-sheet .evran-connector-title{
  color:#f2f6f8 !important;
  font-size:13px !important;
  font-weight:850 !important;
}

/* connector secondary text */
#charger-sheet .evran-connector-sub{
  color:#8fa0ad !important;
  font-size:10px !important;
}

/* connector status */
#charger-sheet .evran-connector-status{
  border-radius:999px !important;
}

/* navigation button */
#charger-sheet .sheet-btn-nav,
#charger-sheet .evran-sheet-nav{
  margin-top:10px !important;

  min-height:46px !important;

  border-radius:15px !important;

  background:
    linear-gradient(
      135deg,
      #20e58a,
      #00cfa0
    ) !important;

  color:#04130b !important;

  border:1px solid rgba(255,255,255,.14) !important;

  box-shadow:
    0 10px 25px rgba(0,210,145,.18),
    inset 0 1px 0 rgba(255,255,255,.28);

  font-weight:900 !important;
}

/* active charging connector */
#charger-sheet .evran-connector-card:has(.evran-connector-soc){
  border-color:rgba(32,229,138,.24) !important;

  box-shadow:
    0 8px 24px rgba(0,0,0,.18),
    0 0 0 1px rgba(32,229,138,.04),
    inset 0 1px 0 rgba(255,255,255,.04);
}


/* =========================================================
   EV-RAN STATION DETAILS V4
   Reference-match layout
   ========================================================= */

body:has(#charger-sheet.open)::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:2990;
  background:rgba(2,10,16,.42);
  backdrop-filter:blur(7px) saturate(115%);
  -webkit-backdrop-filter:blur(7px) saturate(115%);
  pointer-events:none;
}

/* Main floating glass panel */
#charger-sheet{
  position:fixed !important;
  left:50% !important;
  right:auto !important;
  top:50% !important;
  bottom:auto !important;
  width:min(920px,calc(100vw - 28px)) !important;
  max-height:92vh !important;
  transform:translate(-50%,-50%) !important;
  border-radius:32px !important;
  overflow:visible !important;

  background:
    linear-gradient(
      145deg,
      rgba(19,37,47,.91),
      rgba(8,20,29,.88)
    ) !important;

  border:1px solid rgba(180,220,225,.27) !important;

  box-shadow:
    0 35px 90px rgba(0,0,0,.58),
    0 10px 35px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.13) !important;

  backdrop-filter:blur(28px) saturate(135%) !important;
  -webkit-backdrop-filter:blur(28px) saturate(135%) !important;
  z-index:3100 !important;
}

#charger-sheet::before{
  border-radius:inherit !important;
  background:
    radial-gradient(
      circle at 20% 0%,
      rgba(32,229,138,.11),
      transparent 34%
    ),
    radial-gradient(
      circle at 90% 100%,
      rgba(0,210,190,.08),
      transparent 38%
    ),
    linear-gradient(
      180deg,
      rgba(255,255,255,.045),
      transparent 24%
    ) !important;
}

/* Scroll area */
#charger-sheet #sheet-content{
  position:static !important;
  max-height:92vh !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:26px 30px 28px !important;
  scrollbar-width:none !important;
}

#charger-sheet #sheet-content::-webkit-scrollbar{
  display:none !important;
}

/* =========================================================
   CLOSE BUTTON — OUTSIDE TOP RIGHT OF PANEL
   ========================================================= */

#charger-sheet .evran-sheet-close{
  position:absolute !important;
  top:-2px !important;
  right:-82px !important;

  width:58px !important;
  height:58px !important;
  min-width:58px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  padding:0 !important;
  margin:0 !important;

  border-radius:50% !important;

  color:#fff !important;
  background:rgba(19,28,32,.82) !important;
  border:1px solid rgba(255,255,255,.27) !important;

  box-shadow:
    0 12px 30px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.10) !important;

  font-size:38px !important;
  font-weight:300 !important;
  line-height:1 !important;

  z-index:50 !important;

  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
}

/* =========================================================
   GALLERY
   ========================================================= */

#charger-sheet .evran-site-hero{
  position:relative !important;
  width:100% !important;
  height:270px !important;
  min-height:270px !important;
  margin:0 !important;

  border-radius:25px !important;
  overflow:hidden !important;

  background:rgba(10,25,34,.85) !important;

  border:1px solid rgba(255,255,255,.10) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 28px rgba(0,0,0,.20) !important;
}

#charger-sheet .evran-site-hero img{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
}

/* Hide old duplicate single-image block */
#charger-sheet .evran-site-image{
  display:none !important;
}

#charger-sheet .evran-gallery-arrow{
  display:none !important;
}

#charger-sheet .evran-gallery-dots{
  position:absolute !important;
  left:50% !important;
  bottom:10px !important;
  transform:translateX(-50%) !important;

  display:flex !important;
  gap:10px !important;

  padding:8px 13px !important;
  border-radius:999px !important;

  background:rgba(5,20,27,.62) !important;
  border:1px solid rgba(255,255,255,.12) !important;

  backdrop-filter:blur(10px) !important;
  -webkit-backdrop-filter:blur(10px) !important;

  z-index:8 !important;
}

#charger-sheet .evran-gallery-dot{
  width:13px !important;
  height:13px !important;
  padding:0 !important;
  border-radius:50% !important;
  background:rgba(220,235,239,.78) !important;
  border:0 !important;
}

#charger-sheet .evran-gallery-dot.active{
  width:30px !important;
  border-radius:999px !important;
  background:#20e58a !important;
  box-shadow:0 0 12px rgba(32,229,138,.55) !important;
}

/* =========================================================
   HEADER
   ========================================================= */

#charger-sheet .evran-sheet-header{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  margin:18px 0 20px !important;
}

#charger-sheet .evran-sheet-title-wrap{
  min-width:0 !important;
  flex:1 1 auto !important;
}

#charger-sheet .evran-sheet-title{
  font-size:36px !important;
  line-height:1.1 !important;
  font-weight:900 !important;
  letter-spacing:-.6px !important;
  color:#f7fafb !important;
  margin:0 0 8px !important;
}

#charger-sheet .evran-sheet-address{
  font-size:16px !important;
  line-height:1.5 !important;
  color:#9caeb8 !important;
}

#charger-sheet .evran-sheet-header-actions{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  flex:0 0 auto !important;
}

#charger-sheet .evran-sheet-favorite{
  width:66px !important;
  height:66px !important;
  border-radius:21px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  background:rgba(20,45,58,.58) !important;
  border:1px solid rgba(101,153,174,.42) !important;

  color:#f4fafb !important;
  font-size:35px !important;
  line-height:1 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 8px 22px rgba(0,0,0,.15) !important;
}

#charger-sheet .evran-sheet-status{
  min-width:112px !important;
  height:56px !important;

  padding:0 18px !important;
  border-radius:999px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:9px !important;

  background:rgba(0,190,145,.10) !important;
  border:1px solid rgba(0,225,166,.32) !important;

  font-size:16px !important;
  font-weight:850 !important;
  white-space:nowrap !important;
}

#charger-sheet .evran-sheet-status span{
  width:14px !important;
  height:14px !important;
  border-radius:50% !important;
  box-shadow:0 0 12px currentColor !important;
}

/* =========================================================
   POWER / TARIFF
   ========================================================= */

#charger-sheet .evran-sheet-specs{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:18px !important;
  margin:0 0 26px !important;
}

#charger-sheet .evran-sheet-spec{
  min-height:116px !important;

  display:flex !important;
  align-items:center !important;
  gap:18px !important;

  padding:18px !important;
  border-radius:22px !important;

  background:
    linear-gradient(
      145deg,
      rgba(24,47,60,.67),
      rgba(11,29,40,.55)
    ) !important;

  border:1px solid rgba(119,164,181,.38) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 9px 25px rgba(0,0,0,.12) !important;
}

#charger-sheet .evran-sheet-spec-icon{
  width:68px !important;
  height:68px !important;
  flex:0 0 68px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:21px !important;

  color:#f4fafb !important;

  background:rgba(45,74,87,.46) !important;
  border:1px solid rgba(142,183,196,.42) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07) !important;
}

#charger-sheet .evran-sheet-spec-icon svg{
  width:36px !important;
  height:36px !important;
}

#charger-sheet .evran-sheet-spec-copy{
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  gap:6px !important;
}

#charger-sheet .evran-sheet-spec span{
  font-size:15px !important;
  color:#9eb0ba !important;
  margin:0 !important;
}

#charger-sheet .evran-sheet-spec strong{
  font-size:25px !important;
  line-height:1.25 !important;
  color:#f5f8fa !important;
  white-space:nowrap !important;
}

/* =========================================================
   AMENITIES
   ========================================================= */

#charger-sheet .evran-site-title,
#charger-sheet .evran-sheet-section-title{
  font-size:19px !important;
  line-height:1.4 !important;
  font-weight:900 !important;
  color:#f5f8fa !important;
  margin:0 0 12px !important;
}

#charger-sheet .evran-site-grid{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin:0 0 28px !important;
}

#charger-sheet .evran-site-item{
  min-height:52px !important;
  padding:9px 17px !important;

  display:flex !important;
  align-items:center !important;
  gap:9px !important;

  border-radius:17px !important;

  background:
    linear-gradient(
      145deg,
      rgba(27,51,65,.72),
      rgba(13,32,44,.64)
    ) !important;

  border:1px solid rgba(119,164,181,.36) !important;

  color:#f1f5f7 !important;
  font-size:14px !important;
  font-weight:800 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 6px 16px rgba(0,0,0,.10) !important;
}

#charger-sheet .evran-site-item span:first-child{
  font-size:21px !important;
}

/* =========================================================
   CONNECTORS
   ========================================================= */

#charger-sheet .evran-sheet-connectors{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  margin-bottom:24px !important;
}

#charger-sheet .evran-connector-card{
  min-height:112px !important;

  padding:13px 15px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;

  border-radius:21px !important;

  background:
    linear-gradient(
      145deg,
      rgba(24,49,63,.76),
      rgba(10,29,40,.70)
    ) !important;

  border:1px solid rgba(119,164,181,.42) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 9px 24px rgba(0,0,0,.15) !important;
}

#charger-sheet .evran-connector-main{
  min-width:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:16px !important;
  flex:1 1 auto !important;
}

#charger-sheet .evran-connector-icon{
  width:78px !important;
  height:78px !important;
  flex:0 0 78px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border-radius:23px !important;

  background:
    linear-gradient(
      145deg,
      rgba(0,215,165,.12),
      rgba(0,100,105,.08)
    ) !important;

  border:1px solid rgba(32,229,138,.32) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 22px rgba(0,215,165,.08) !important;
}

#charger-sheet .evran-connector-icon .evran-connector-svg{
  width:53px !important;
  height:53px !important;
}

#charger-sheet .evran-connector-title{
  font-size:24px !important;
  line-height:1.2 !important;
  font-weight:900 !important;
  color:#f7fafb !important;
}

#charger-sheet .evran-connector-sub{
  margin-top:7px !important;
  font-size:15px !important;
  color:#a2b2bb !important;
}

#charger-sheet .evran-connector-right{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:18px !important;
  flex:0 0 auto !important;
}

#charger-sheet .evran-connector-status{
  display:flex !important;
  align-items:center !important;
  gap:8px !important;

  padding:0 !important;
  background:none !important;
  border:0 !important;

  color:#b9c6cd !important;
  font-size:15px !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

#charger-sheet .evran-connector-soc{
  margin-top:5px !important;
  font-size:12px !important;
  color:#20e58a !important;
}

#charger-sheet .evran-sheet-start{
  min-width:190px !important;
  height:58px !important;

  padding:0 18px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  border:0 !important;
  border-radius:17px !important;

  background:linear-gradient(
    135deg,
    #20e58a,
    #00d3ad
  ) !important;

  color:#032016 !important;

  font-size:15px !important;
  font-weight:950 !important;

  box-shadow:
    0 10px 25px rgba(0,215,165,.18),
    inset 0 1px 0 rgba(255,255,255,.28) !important;
}

/* =========================================================
   NAVIGATION
   ========================================================= */

#charger-sheet .evran-sheet-actions{
  margin:4px 0 0 !important;
}

#charger-sheet .evran-sheet-nav{
  position:relative !important;

  width:100% !important;
  min-height:76px !important;

  display:flex !important;
  align-items:center !important;
  justify-content:center !important;

  gap:14px !important;
  padding:0 55px !important;

  border-radius:22px !important;

  background:
    linear-gradient(
      145deg,
      rgba(46,68,82,.80),
      rgba(25,47,61,.72)
    ) !important;

  border:1px solid rgba(119,164,181,.45) !important;

  color:#f4f8fa !important;

  font-size:22px !important;
  font-weight:900 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.16) !important;
}

#charger-sheet .evran-sheet-nav::before{
  content:"⌖";
  font-size:34px;
  line-height:1;
}

#charger-sheet .evran-sheet-nav::after{
  content:"›";
  position:absolute;
  right:28px;
  font-size:36px;
  line-height:1;
  color:#dce9ee;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width:700px){

  #charger-sheet{
    width:calc(100vw - 16px) !important;
    max-height:94vh !important;
    border-radius:27px !important;
  }

  #charger-sheet #sheet-content{
    max-height:94vh !important;
    padding:18px 16px 20px !important;
  }

  #charger-sheet .evran-sheet-close{
    top:-52px !important;
    right:2px !important;
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
    font-size:31px !important;
  }

  #charger-sheet .evran-site-hero{
    height:205px !important;
    min-height:205px !important;
    border-radius:21px !important;
  }

  #charger-sheet .evran-sheet-header{
    align-items:flex-start !important;
    gap:10px !important;
    margin:15px 0 17px !important;
  }

  #charger-sheet .evran-sheet-title{
    font-size:21px !important;
    line-height:1.25 !important;
  }

  #charger-sheet .evran-sheet-address{
    font-size:11px !important;
  }

  #charger-sheet .evran-sheet-header-actions{
    gap:7px !important;
  }

  #charger-sheet .evran-sheet-favorite{
    width:44px !important;
    height:44px !important;
    border-radius:14px !important;
    font-size:24px !important;
  }

  #charger-sheet .evran-sheet-status{
    min-width:auto !important;
    height:42px !important;
    padding:0 11px !important;
    font-size:11px !important;
  }

  #charger-sheet .evran-sheet-specs{
    gap:8px !important;
    margin-bottom:20px !important;
  }

  #charger-sheet .evran-sheet-spec{
    min-height:82px !important;
    padding:11px !important;
    gap:9px !important;
    border-radius:16px !important;
  }

  #charger-sheet .evran-sheet-spec-icon{
    width:44px !important;
    height:44px !important;
    flex-basis:44px !important;
    border-radius:14px !important;
  }

  #charger-sheet .evran-sheet-spec-icon svg{
    width:25px !important;
    height:25px !important;
  }

  #charger-sheet .evran-sheet-spec span{
    font-size:10px !important;
  }

  #charger-sheet .evran-sheet-spec strong{
    font-size:14px !important;
    white-space:normal !important;
  }

  #charger-sheet .evran-site-title,
  #charger-sheet .evran-sheet-section-title{
    font-size:14px !important;
    margin-bottom:8px !important;
  }

  #charger-sheet .evran-site-grid{
    gap:6px !important;
    margin-bottom:20px !important;
  }

  #charger-sheet .evran-site-item{
    min-height:38px !important;
    padding:6px 9px !important;
    border-radius:12px !important;
    font-size:10px !important;
  }

  #charger-sheet .evran-site-item span:first-child{
    font-size:15px !important;
  }

  #charger-sheet .evran-sheet-connectors{
    gap:8px !important;
    margin-bottom:16px !important;
  }

  #charger-sheet .evran-connector-card{
    min-height:88px !important;
    padding:9px !important;
    gap:8px !important;
    border-radius:16px !important;
  }

  #charger-sheet .evran-connector-main{
    gap:9px !important;
  }

  #charger-sheet .evran-connector-icon{
    width:52px !important;
    height:52px !important;
    flex-basis:52px !important;
    border-radius:16px !important;
  }

  #charger-sheet .evran-connector-icon .evran-connector-svg{
    width:36px !important;
    height:36px !important;
  }

  #charger-sheet .evran-connector-title{
    font-size:15px !important;
  }

  #charger-sheet .evran-connector-sub{
    margin-top:3px !important;
    font-size:10px !important;
  }

  #charger-sheet .evran-connector-right{
    gap:7px !important;
  }

  #charger-sheet .evran-connector-status{
    font-size:10px !important;
  }

  #charger-sheet .evran-sheet-start{
    min-width:112px !important;
    height:44px !important;
    padding:0 9px !important;
    border-radius:13px !important;
    font-size:10px !important;
  }

  #charger-sheet .evran-sheet-nav{
    min-height:56px !important;
    border-radius:17px !important;
    font-size:16px !important;
  }

  #charger-sheet .evran-sheet-nav::before{
    font-size:25px;
  }

  #charger-sheet .evran-sheet-nav::after{
    right:17px;
    font-size:29px;
  }
}


/* =========================================================
   EV-RAN STATION SHEET V8 — PANEL ONLY GLASS
   ========================================================= */

/*
 * IMPORTANT:
 * No fullscreen blur.
 * No fullscreen dark overlay.
 * The map/page behind the station sheet stays sharp.
 */
body:has(#charger-sheet.open)::before{
  display:none !important;
}

/*
 * Main station sheet.
 * The sheet itself is transparent; its ::before pseudo-element
 * provides the glass background.
 */
#charger-sheet{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  isolation:isolate !important;
  z-index:3100 !important;
}

/*
 * Glass background — ONLY inside the station sheet.
 */
#charger-sheet::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  pointer-events:none !important;
  border-radius:inherit !important;

  background:
    radial-gradient(
      circle at 18% 0%,
      rgba(32,229,138,.12),
      transparent 34%
    ),
    radial-gradient(
      circle at 92% 100%,
      rgba(0,210,190,.09),
      transparent 38%
    ),
    linear-gradient(
      145deg,
      rgba(19,37,47,.86),
      rgba(8,20,29,.82)
    ) !important;

  border:1px solid rgba(180,220,225,.27) !important;

  box-shadow:
    0 35px 90px rgba(0,0,0,.58),
    0 10px 35px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.13) !important;

  backdrop-filter:blur(28px) saturate(135%) !important;
  -webkit-backdrop-filter:blur(28px) saturate(135%) !important;
}

/*
 * Keep all sheet content above the glass layer.
 * Content itself remains completely sharp.
 */
#charger-sheet #sheet-content{
  position:relative !important;
  z-index:1 !important;
}

/*
 * Keep the close button above everything.
 */
#charger-sheet .evran-sheet-close{
  z-index:60 !important;
}

/*
 * Mobile: keep the same glass behavior.
 */
@media (max-width:700px){
  #charger-sheet::before{
    border-radius:inherit !important;
  }
}


/* =========================================================
   EV-RAN V8 — CLOSE BUTTON FINAL POSITION
   ========================================================= */

#charger-sheet .evran-sheet-close{
  top:-30px !important;
  right:0 !important;
  width:50px !important;
  height:50px !important;
  min-width:50px !important;
  z-index:100 !important;
}

@media (max-width:700px){
  #charger-sheet .evran-sheet-close{
    top:-30px !important;
    right:4px !important;
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
    font-size:30px !important;
  }
}

/* =========================================================
   EV-RAN STATION DETAILS — POLISH V1
   Glass / spacing / hierarchy
   ========================================================= */

/* Panel: lighter glass, stronger depth, no page blur */
#charger-sheet{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Panel glass layer */
#charger-sheet::before{
  background:
    radial-gradient(
      circle at 18% 0%,
      rgba(32,229,138,.105),
      transparent 34%
    ),
    radial-gradient(
      circle at 92% 100%,
      rgba(0,210,190,.075),
      transparent 38%
    ),
    linear-gradient(
      145deg,
      rgba(20,42,52,.78),
      rgba(7,22,31,.73)
    ) !important;

  border:1px solid rgba(190,225,230,.24) !important;

  box-shadow:
    0 35px 90px rgba(0,0,0,.52),
    0 12px 35px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.12) !important;

  backdrop-filter:blur(30px) saturate(135%) !important;
  -webkit-backdrop-filter:blur(30px) saturate(135%) !important;
}

/* Content remains sharp above glass */
#charger-sheet #sheet-content{
  position:relative !important;
  z-index:1 !important;
  padding:24px 28px 28px !important;
}

/* Gallery */
#charger-sheet .evran-site-hero{
  height:250px !important;
  min-height:250px !important;
  border-radius:24px !important;
}

/* Header */
#charger-sheet .evran-sheet-header{
  margin:16px 2px 18px !important;
  gap:16px !important;
}

#charger-sheet .evran-sheet-title{
  font-size:32px !important;
  letter-spacing:-.5px !important;
  margin-bottom:6px !important;
}

#charger-sheet .evran-sheet-address{
  font-size:15px !important;
  color:rgba(204,218,224,.72) !important;
}

/* Favorite */
#charger-sheet .evran-sheet-favorite{
  width:56px !important;
  height:56px !important;
  border-radius:18px !important;
  font-size:29px !important;

  background:rgba(24,55,67,.42) !important;
  border:1px solid rgba(150,190,202,.30) !important;
}

/* Online badge */
#charger-sheet .evran-sheet-status{
  min-width:104px !important;
  height:48px !important;
  padding:0 15px !important;
  font-size:14px !important;
}

/* Power / tariff */
#charger-sheet .evran-sheet-specs{
  gap:14px !important;
  margin-bottom:22px !important;
}

#charger-sheet .evran-sheet-spec{
  min-height:96px !important;
  padding:15px !important;
  gap:15px !important;
  border-radius:20px !important;

  background:
    linear-gradient(
      145deg,
      rgba(29,57,69,.54),
      rgba(10,29,39,.43)
    ) !important;

  border:1px solid rgba(135,178,191,.27) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 8px 22px rgba(0,0,0,.10) !important;
}

#charger-sheet .evran-sheet-spec-icon{
  width:58px !important;
  height:58px !important;
  flex:0 0 58px !important;
  border-radius:18px !important;

  background:rgba(49,82,94,.32) !important;
  border:1px solid rgba(155,190,200,.28) !important;
}

#charger-sheet .evran-sheet-spec-icon svg{
  width:31px !important;
  height:31px !important;
}

@media (max-width:700px){

  #charger-sheet #sheet-content{
    padding:18px 16px 22px !important;
  }

  #charger-sheet .evran-site-hero{
    height:205px !important;
    min-height:205px !important;
    border-radius:21px !important;
  }

  #charger-sheet .evran-sheet-header{
    margin:14px 0 16px !important;
  }

  #charger-sheet .evran-sheet-title{
    font-size:25px !important;
  }

  #charger-sheet .evran-sheet-address{
    font-size:13px !important;
  }

  #charger-sheet .evran-sheet-favorite{
    width:48px !important;
    height:48px !important;
    border-radius:15px !important;
    font-size:25px !important;
  }

  #charger-sheet .evran-sheet-status{
    min-width:88px !important;
    height:42px !important;
    padding:0 11px !important;
    font-size:12px !important;
  }

  #charger-sheet .evran-sheet-specs{
    gap:10px !important;
    margin-bottom:18px !important;
  }

  #charger-sheet .evran-sheet-spec{
    min-height:82px !important;
    padding:11px !important;
    gap:10px !important;
    border-radius:17px !important;
  }

  #charger-sheet .evran-sheet-spec-icon{
    width:46px !important;
    height:46px !important;
    flex:0 0 46px !important;
    border-radius:14px !important;
  }

  #charger-sheet .evran-sheet-spec-icon svg{
    width:25px !important;
    height:25px !important;
  }
}


/* =========================================================
   EV-RAN GALLERY — FIXED FRAME
   ========================================================= */

#charger-sheet .evran-gallery{
  position:relative !important;
  width:100% !important;
  height:250px !important;
  min-height:250px !important;
  overflow:hidden !important;
}

#charger-sheet .evran-gallery-slide{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  overflow:hidden !important;
}

#charger-sheet .evran-gallery-slide img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;

  object-fit:contain !important;
  object-position:center center !important;

  padding:0 !important;
  margin:0 !important;
  box-sizing:border-box !important;

  user-select:none !important;
  -webkit-user-drag:none !important;
}

@media (max-width:700px){
  #charger-sheet .evran-gallery{
    height:205px !important;
    min-height:205px !important;
  }

  #charger-sheet .evran-gallery-slide{
    height:205px !important;
  }
}


/* =========================================================
   EV-RAN STATION HEADER — POLISH V1
   ========================================================= */

#charger-sheet .evran-sheet-header{
  margin:14px 2px 16px !important;
  gap:14px !important;
  align-items:center !important;
}

#charger-sheet .evran-sheet-title-wrap{
  min-width:0 !important;
  flex:1 1 auto !important;
}

#charger-sheet .evran-sheet-title{
  font-size:29px !important;
  line-height:1.18 !important;
  font-weight:850 !important;
  letter-spacing:-.45px !important;
  margin:0 0 6px !important;
  color:#f5f9fa !important;
}

#charger-sheet .evran-sheet-address{
  font-size:14px !important;
  line-height:1.45 !important;
  color:rgba(203,218,224,.70) !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

#charger-sheet .evran-sheet-header-actions{
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  flex:0 0 auto !important;
}

#charger-sheet .evran-sheet-favorite{
  width:50px !important;
  height:50px !important;
  min-width:50px !important;
  border-radius:16px !important;

  background:rgba(25,55,67,.38) !important;
  border:1px solid rgba(155,194,205,.28) !important;

  font-size:26px !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 7px 18px rgba(0,0,0,.12) !important;
}

#charger-sheet .evran-sheet-status{
  min-width:96px !important;
  height:44px !important;

  padding:0 13px !important;
  border-radius:999px !important;

  gap:8px !important;

  background:rgba(0,190,145,.085) !important;
  border:1px solid rgba(0,225,166,.27) !important;

  font-size:13px !important;
  font-weight:800 !important;
}

#charger-sheet .evran-sheet-status span{
  width:10px !important;
  height:10px !important;
}

@media (max-width:700px){

  #charger-sheet .evran-sheet-header{
    margin:12px 0 14px !important;
    gap:10px !important;
  }

  #charger-sheet .evran-sheet-title{
    font-size:22px !important;
    line-height:1.2 !important;
    letter-spacing:-.25px !important;
    margin-bottom:5px !important;
  }

  #charger-sheet .evran-sheet-address{
    font-size:12px !important;
    line-height:1.4 !important;
  }

  #charger-sheet .evran-sheet-header-actions{
    gap:7px !important;
  }

  #charger-sheet .evran-sheet-favorite{
    width:43px !important;
    height:43px !important;
    min-width:43px !important;
    border-radius:14px !important;
    font-size:23px !important;
  }

  #charger-sheet .evran-sheet-status{
    min-width:76px !important;
    height:38px !important;
    padding:0 9px !important;
    gap:6px !important;
    font-size:11px !important;
  }

  #charger-sheet .evran-sheet-status span{
    width:8px !important;
    height:8px !important;
  }
}


/* =========================================================
   EV-RAN STATION SPECS — POLISH V1
   ========================================================= */

#charger-sheet .evran-sheet-specs{
  grid-template-columns:1fr 1fr !important;
  gap:12px !important;
  margin:0 0 20px !important;
}

#charger-sheet .evran-sheet-spec{
  min-height:88px !important;
  padding:13px 14px !important;

  display:flex !important;
  align-items:center !important;
  gap:12px !important;

  border-radius:18px !important;

  background:
    linear-gradient(
      145deg,
      rgba(31,61,73,.46),
      rgba(9,28,38,.36)
    ) !important;

  border:1px solid rgba(150,190,202,.24) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 7px 20px rgba(0,0,0,.10) !important;
}

#charger-sheet .evran-sheet-spec-icon{
  width:50px !important;
  height:50px !important;
  min-width:50px !important;
  flex:0 0 50px !important;

  border-radius:15px !important;

  background:rgba(55,88,99,.27) !important;
  border:1px solid rgba(165,198,207,.24) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

#charger-sheet .evran-sheet-spec-icon svg{
  width:27px !important;
  height:27px !important;
}

#charger-sheet .evran-sheet-spec-copy{
  min-width:0 !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  gap:3px !important;
}

#charger-sheet .evran-sheet-spec-copy span{
  font-size:11px !important;
  line-height:1.3 !important;
  color:rgba(190,209,215,.62) !important;
}

#charger-sheet .evran-sheet-spec-copy strong{
  font-size:19px !important;
  line-height:1.2 !important;
  font-weight:850 !important;
  color:#f4fafb !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

@media (max-width:700px){

  #charger-sheet .evran-sheet-specs{
    gap:9px !important;
    margin-bottom:17px !important;
  }

  #charger-sheet .evran-sheet-spec{
    min-height:76px !important;
    padding:10px !important;
    gap:9px !important;
    border-radius:16px !important;
  }

  #charger-sheet .evran-sheet-spec-icon{
    width:43px !important;
    height:43px !important;
    min-width:43px !important;
    flex-basis:43px !important;
    border-radius:13px !important;
  }

  #charger-sheet .evran-sheet-spec-icon svg{
    width:23px !important;
    height:23px !important;
  }

  #charger-sheet .evran-sheet-spec-copy span{
    font-size:10px !important;
  }

  #charger-sheet .evran-sheet-spec-copy strong{
    font-size:16px !important;
  }
}


/* =========================================================
   EV-RAN STATION DETAILS — AMENITIES POLISH V1
   ========================================================= */

#charger-sheet .evran-site-title{
  font-size:15px !important;
  line-height:1.4 !important;
  font-weight:850 !important;
  margin:2px 2px 10px !important;
  color:#f3f7f9 !important;
}

#charger-sheet .evran-site-grid{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:7px !important;
  margin:0 0 20px !important;
}

#charger-sheet .evran-site-item{
  min-height:34px !important;
  height:34px !important;
  padding:0 11px !important;

  display:inline-flex !important;
  flex:0 0 auto !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;

  border-radius:11px !important;

  background:
    linear-gradient(
      145deg,
      rgba(25,49,63,.76),
      rgba(11,29,40,.68)
    ) !important;

  border:1px solid rgba(119,164,181,.24) !important;

  color:#dce6eb !important;
  font-size:11px !important;
  font-weight:750 !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 4px 12px rgba(0,0,0,.08) !important;

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

#charger-sheet .evran-site-item span:first-child{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:16px !important;
  line-height:1 !important;
}

#charger-sheet .evran-site-item span:last-child{
  white-space:nowrap !important;
  line-height:1 !important;
}

@media (max-width:700px){

  #charger-sheet .evran-site-title{
    font-size:13px !important;
    margin:0 1px 8px !important;
  }

  #charger-sheet .evran-site-grid{
    gap:5px !important;
    margin-bottom:17px !important;
  }

  #charger-sheet .evran-site-item{
    min-height:31px !important;
    height:31px !important;
    padding:0 9px !important;
    border-radius:10px !important;
    gap:5px !important;
    font-size:10px !important;
  }

  #charger-sheet .evran-site-item span:first-child{
    font-size:14px !important;
  }
}


/* EV-Ran charger spiderfy */
.evran-spiderfy-hidden {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.evran-spiderfy-marker {
  z-index: 1800 !important;
  pointer-events: auto !important;
}

.evran-spiderfy-line {
  border-radius: 999px;
  opacity: .75;
}


/* EV-Ran language settings */
.evran-language-option{
  display:flex;
  align-items:center;
  gap:14px;
  width:100%;
  padding:16px;
  margin-bottom:10px;
  border:1px solid var(--ev-border);
  border-radius:18px;
  background:var(--ev-card);
  color:inherit;
  text-decoration:none;
  box-sizing:border-box;
  transition:all .18s ease;
}

.evran-language-option.active{
  border-color:var(--ev-green, #16c957);
  box-shadow:0 0 0 1px var(--ev-green, #16c957);
}

.evran-language-flag{
  width:46px;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:var(--ev-surface, rgba(255,255,255,.06));
  font-size:25px;
  flex:none;
}

.evran-language-info{
  flex:1;
  min-width:0;
}

.evran-language-name{
  font-size:16px;
  font-weight:700;
}

.evran-language-desc{
  margin-top:4px;
  font-size:12px;
  opacity:.62;
}

.evran-language-check{
  width:28px;
  height:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--ev-green, #16c957);
  color:#fff;
  font-size:15px;
  font-weight:800;
  flex:none;
}
