/* =====================================================
STATION PAGE — FINAL THEME
Drop-in replacement for station-new.css
Compatible with current station.php markup
===================================================== */

:root{
  --station-bg:#08111d;
  --station-bg-2:#0b1727;
  --station-surface:#0f1b2d;
  --station-surface-2:#13253c;
  --station-surface-3:#17304d;
  --station-border:rgba(255,255,255,.08);
  --station-border-strong:rgba(255,255,255,.14);
  --station-text:#eef4fb;
  --station-text-2:rgba(238,244,251,.82);
  --station-muted:rgba(238,244,251,.62);
  --station-accent:#ff9a1f;
  --station-accent-2:#ff7a18;
  --station-blue:#3563ff;
  --station-blue-2:#2649c7;
  --station-green:#22c55e;
  --station-red:#ff6363;
  --station-yellow:#ffb84d;
  --station-shadow:0 16px 40px rgba(0,0,0,.24);
  --station-shadow-hover:0 22px 46px rgba(0,0,0,.32);
  --station-radius:20px;
}

/* =====================================================
BASE
===================================================== */

html,
body{
  min-height:100%;
}

body,
body.station-page,
.station-page{
  background:
    radial-gradient(circle at 20% 0%, rgba(255,193,7,.10), transparent 35%),
    radial-gradient(circle at 80% 100%, rgba(80,140,255,.08), transparent 40%),
    linear-gradient(180deg,var(--station-bg) 0%, var(--station-bg-2) 100%) !important;
  background-attachment: fixed;
  color:var(--station-text);
}

.container{
  position:relative;
}

/* =====================================================
BOOTSTRAP CARDS / MAIN SURFACES
===================================================== */

.station-page .card,
.station-page .card.shadow-sm,
.container .card.shadow-sm,
.station-dashboard .card,
.station-extra-grid .card,
.station-map-grid .card,
.chart-card{
  background:linear-gradient(180deg,var(--station-surface) 0%, var(--station-surface-2) 100%) !important;
  border:1px solid var(--station-border) !important;
  border-radius:22px !important;
  box-shadow:var(--station-shadow) !important;
  overflow:hidden;
  color:var(--station-text);
}

.station-page .card > .card-body,
.station-page .card.shadow-sm > .card-body,
.container .card.shadow-sm > .card-body,
.station-dashboard .card > .card-body,
.station-extra-grid .card > .card-body,
.station-map-grid .card > .card-body,
.chart-card{
  background:transparent !important;
  color:var(--station-text);
}

/* =====================================================
HEADER NAD CENAMI
===================================================== */

.prices-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:16px;
  margin-bottom:18px;
  padding:0 0 16px;
  border-bottom:1px solid var(--station-border) !important;
}

.prices-station{
  display:flex;
  align-items:center;
  gap:16px;
  min-width:0;
}

.prices-logo{
  width:66px;
  height:66px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.08) 0%, rgba(255,255,255,.04) 100%);
  border:1px solid var(--station-border);
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}

.prices-logo img{
  max-width:44px;
  max-height:44px;
  width:auto;
  height:auto;
}

.brand-text{
  font-size:18px;
  font-weight:800;
  letter-spacing:.3px;
  color:var(--station-text) !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid var(--station-border) !important;
  padding:10px 14px;
  border-radius:12px;
}

.station-info{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  min-width:0;
  color:var(--station-text) !important;
}

.station-name,
.prices-address,
.station-address{
  color:var(--station-text) !important;
}

.station-name{
  font-size:20px;
  font-weight:800;
}

.prices-address,
.station-address{
  font-size:15px;
  line-height:1.45;
  font-weight:600;
  color:var(--station-text-2) !important;
}

.prices-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

/* =====================================================
ACTIONS
===================================================== */

.favorite-btn,
.nav-small,
.edit-prices-btn,
.nav-btn,
.confirm-price,
.add-price-btn{
  transition:.18s ease;
}

.favorite-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:118px;
  height:40px;
  padding:0 14px;
  border-radius:12px;
  border:1px solid rgba(255,154,31,.2);
  background:linear-gradient(135deg,#ff9131,#ff7a18) !important;
  color:#fff !important;
  font-size:14px;
  font-weight:800;
  box-shadow:0 10px 18px rgba(249,115,22,.2);
  cursor:pointer;
}

.favorite-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 24px rgba(249,115,22,.28);
}

.favorite-btn.active{
  background:rgba(255,145,49,.14) !important;
  color:#ffcb92 !important;
  border:1px solid rgba(255,145,49,.45) !important;
  box-shadow:none;
}

.favorite-btn .fav-icon{
  font-size:15px;
}

.nav-card{
  background:linear-gradient(135deg,#315ca8,#27498a) !important;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  text-decoration:none;
  color:white !important;
  box-shadow:0 10px 20px rgba(39,73,138,.26);
}

.nav-card:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 28px rgba(39,73,138,.32);
  color:#fff;
}

.nav-small{
  min-width:112px;
  height:40px;
  padding:0 14px;
}

.nav-content{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:800;
}

.nav-btn{
  display:block;
  background:linear-gradient(135deg,var(--station-blue),var(--station-blue-2)) !important;
  color:white !important;
  text-align:center;
  padding:13px 16px;
  border-radius:14px;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 12px 22px rgba(37,99,235,.2);
}

.nav-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 28px rgba(37,99,235,.26);
  color:#fff;
}

.edit-prices-btn{
  border-radius:18px;
  height:76px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:linear-gradient(135deg,var(--station-blue),var(--station-blue-2)) !important;
  color:white !important;
  font-weight:800;
  font-size:16px;
  border:none;
  cursor:pointer;
  box-shadow:0 12px 22px rgba(37,99,235,.22);
}

.edit-prices-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 28px rgba(37,99,235,.28);
}

/* =====================================================
GRID CEN
===================================================== */

.fuel-row{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr)) minmax(170px,190px);
  gap:14px;
  align-items:stretch;
  width:100%;
}

.fuel-row > *{
  min-width:0;
}

/* =====================================================
KAFEL PALIWA
===================================================== */

.fuel-card{
  position:relative;
  background:linear-gradient(180deg,#13253c 0%, #102033 100%) !important;
  border:1px solid var(--station-border) !important;
  border-radius:18px !important;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  min-height:228px;
  box-shadow:0 14px 28px rgba(0,0,0,.24) !important;
}

.fuel-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--station-shadow-hover) !important;
}

.fuel-user-highlight{
  border-color:rgba(255,153,51,.75) !important;
  box-shadow:0 0 0 1px rgba(255,153,51,.28), 0 16px 34px rgba(0,0,0,.34) !important;
}

.fuel-user-highlight::after{
  content:"Twoje paliwo";
  position:absolute;
  top:0px;
  right:0px;
  padding:4px 8px;
  border-radius:999px;
  background:linear-gradient(135deg,#ff9a1f,#ff7a18);
  color:#fff;
  font-size:10px;
  font-weight:800;
  letter-spacing:.2px;
  line-height:1;
  box-shadow:0 6px 16px rgba(255,122,24,.28);
  z-index:3;
}

.fuel-top{
  padding:16px 14px 14px;
  text-align:center;
  background:linear-gradient(180deg,#17304d 0%, #14283f 100%) !important;
  border-bottom:1px solid var(--station-border) !important;
}

.fuel-name{
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:800;
  color:var(--station-text) !important;
  margin-bottom:8px;
}

.fuel-price{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:5px;
}

.price-number{
  font-size:38px;
  font-weight:900;
  line-height:1;
  letter-spacing:-1.4px;
  color:var(--station-text) !important;
}

.price-currency{
  font-size:13px;
  color:var(--station-text-2) !important;
  margin-bottom:4px;
}

.fuel-bottom,
.fuel-bottom.fuel-empty{
  background:#102033 !important;
  padding:14px;
  text-align:center;
  font-size:12px;
  flex-grow:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:7px;
  color:var(--station-text-2);
}

.fuel-update,
.fuel-user,
.price-confirmations,
.price-old-warning,
.fuel-no-price{
  color:var(--station-text-2) !important;
}

.fuel-update{
  font-size:12px;
}

.fuel-user{
  font-size:11px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:4px;
}

.fuel-user a{
  background:rgba(255,255,255,.08) !important;
  color:#dbe8ff !important;
  padding:3px 7px;
  border-radius:8px;
  font-weight:700;
  text-decoration:none;
  font-size:11px;
}

.fuel-user a:hover{
  background:rgba(255,255,255,.14) !important;
  color:#fff !important;
}

.price-change{
  font-size:12px;
  font-weight:800;
}

.price-up,
.price-verified,
.change-up{
  color:var(--station-green) !important;
}

.price-down,
.change-down{
  color:var(--station-red) !important;
}

.price-same{
  color:var(--station-muted) !important;
}

.price-pending{
  color:var(--station-accent) !important;
}

.price-ai{
  color:#60a5fa !important;
}

.price-old-warning{
  font-size:12px;
  font-weight:700;
  color:var(--station-yellow) !important;
}

.confirm-price{
  margin-top:auto;
  background:linear-gradient(135deg,var(--station-accent),var(--station-accent-2)) !important;
  color:#fff !important;
  border:none;
  width:100%;
  height:56px;
  font-weight:800;
  font-size:13px;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border-radius:0 0 18px 18px;
}

.confirm-price:hover{
  filter:brightness(1.04);
}

.confirm-price span{
  font-size:11px;
  opacity:.92;
}

.add-price-btn{
  margin-top:auto;
  background:linear-gradient(135deg,#4b5563,#374151) !important;
  color:white !important;
  border:none;
  width:100%;
  height:56px;
  font-weight:800;
  font-size:13px;
  cursor:pointer;
  border-radius:0 0 18px 18px;
}

.add-price-btn:hover{
  filter:brightness(1.06);
}

.fuel-missing{
  opacity:.9;
}

.fuel-empty{
  background:#102033 !important;
}

.fuel-card:has(.fuel-empty){
  opacity:.92;
}

.fuel-no-price{
  font-size:14px;
  font-weight:700;
  margin-bottom:10px;
}

/* =====================================================
KOLUMNA AKCJI
===================================================== */

.fuel-actions-column{
  display:flex;
  flex-direction:column;
  gap:14px;
  align-self:stretch;
}

.confirm-all{
  border-radius:18px;
  overflow:hidden;
  cursor:pointer;
  box-shadow:0 14px 28px rgba(0,0,0,.26) !important;
  display:flex;
  flex-direction:column;
  transition:.18s ease;
  flex:1;
  text-decoration:none;
}

.confirm-all:hover{
  transform:translateY(-4px);
  box-shadow:var(--station-shadow-hover) !important;
}

.confirm-all-top{
  flex:1;
  min-height:142px;
  background:linear-gradient(135deg,#f59e0b,#ea580c) !important;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#fff !important;
  font-weight:800;
}

.confirm-fire{
  font-size:38px;
  margin-bottom:6px;
}

.confirm-title{
  font-size:19px;
  font-weight:900;
  color:#fff !important;
}

.confirm-all-bottom{
  background:#102033 !important;
  text-align:center;
  padding:12px;
  font-weight:900;
  font-size:18px;
  color:var(--station-text) !important;
  border-top:1px solid var(--station-border) !important;
}

.login-info-popup{
  position:fixed;
  bottom:20px;
  left:50%;
  transform:translateX(-50%) translateY(20px);
  background:#0f172a;
  color:#fff;
  padding:12px 18px;
  border-radius:12px;
  font-size:14px;
  opacity:0;
  transition:all .3s ease;
  z-index:9999;
  box-shadow:0 12px 30px rgba(0,0,0,.25);
}

.login-info-popup.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

/* =====================================================
SEKCJE / KARTY / TYTUŁY
===================================================== */

.section-title,
.chart-title{
  font-size:19px;
  font-weight:800;
  color:var(--station-text) !important;
  display:flex;
  align-items:center;
  padding-bottom:12px;
  margin-bottom:14px;
  border-bottom:1px solid var(--station-border) !important;
  position:relative;
  padding-left:14px;
}

.chart-title{
  font-size:16px;
  padding-left:0;
  border-bottom:none !important;
  margin-bottom:10px;
}

.section-title:before{
  content:"";
  position:absolute;
  left:0;
  top:3px;
  width:4px;
  height:22px;
  background:linear-gradient(180deg,var(--station-accent),var(--station-accent-2)) !important;
  border-radius:999px;
}

.station-dashboard{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  align-items:start;
  margin-bottom:20px;
}

.chart{
  height:340px;
}

.chart canvas,
#priceChart{
  width:100%;
}

#priceChart{
  height:120px !important;
  max-height:120px;
  margin-top:6px;
}

.chart canvas{
  height:240px !important;
}

/* =====================================================
WYKRES / SWITCH
===================================================== */

.fuel-chart-switch{
  display:flex;
  gap:8px;
  margin-bottom:15px;
  flex-wrap:wrap;
}

.chart-fuel-btn,
.fuel-badge{
  border:1px solid var(--station-border) !important;
  background:rgba(255,255,255,.08) !important;
  padding:4px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  color:var(--station-text-2) !important;
  cursor:pointer;
  transition:all .15s ease;
  white-space:nowrap;
}

.chart-fuel-btn:hover,
.fuel-badge:hover{
  background:#ff8a00 !important;
  border-color:transparent !important;
  color:#fff !important;
}

.chart-fuel-btn.active,
.fuel-badge.active{
  background:linear-gradient(135deg,var(--station-accent),var(--station-accent-2)) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 6px 14px rgba(249,115,22,.22);
}

.chart-card{
  background:#102033 !important;
  border-radius:18px;
  padding:18px;
  border:1px solid var(--station-border) !important;
  box-shadow:var(--station-shadow) !important;
}

.chart-stats{
  display:flex;
  justify-content:space-between;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--station-border) !important;
}

.chart-stat{text-align:center;}
.chart-stat-value,
.stat-value{
  font-size:18px;
  font-weight:800;
  color:var(--station-text) !important;
}

.stat-value{
  font-size:22px;
}

.chart-stat-label,
.chart-stat-icon.avg,
.stat-top,
.stat-sub,
.update-action,
.update-time,
.amenity-name,
.updates-empty-sub{
  color:var(--station-text-2) !important;
}

.chart-stat-icon{font-size:14px;margin-bottom:4px;}
.chart-stat-icon.down{color:var(--station-green);}
.chart-stat-icon.up{color:var(--station-red);}

/* =====================================================
STATYSTYKI STACJI
===================================================== */

.station-stats-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:10px;
}

.station-stat-box{
  background:linear-gradient(180deg,#13253c 0%, #102033 100%) !important;
  border:1px solid var(--station-border) !important;
  border-radius:16px;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:6px;
  transition:.15s ease;
  box-shadow:0 10px 22px rgba(0,0,0,.18) !important;
}

.station-stat-box:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 26px rgba(0,0,0,.24) !important;
}

.stat-top{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
}

.stat-icon{
  font-size:15px;
  opacity:.85;
}

/* =====================================================
LOKALIZACJA + UDOGODNIENIA
===================================================== */

.location-map,
.station-extra-grid .card-body{
  flex:1;
  display:flex;
  flex-direction:column;
}

.location-map iframe{
  width:100%;
  height:100%;
  min-height:260px;
  border:0;
  border-radius:16px !important;
  margin-bottom:12px;
  box-shadow:0 10px 22px rgba(0,0,0,.16);
  filter: grayscale(0.15) brightness(0.72) contrast(1.08) saturate(0.85);
}

.amenities-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin-top:10px;
}

.amenity-box{
  background:linear-gradient(180deg,#13253c 0%, #102033 100%) !important;
  border-radius:16px;
  padding:16px;
  text-align:center;
  border:1px solid var(--station-border) !important;
  transition:.16s ease;
  box-shadow:0 10px 22px rgba(0,0,0,.18) !important;
}

.amenity-box:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 26px rgba(0,0,0,.24) !important;
}

.amenity-icon{font-size:28px;margin-bottom:6px;}
.amenity-name{
  font-size:13px;
  font-weight:700;
  color:var(--station-text) !important;
}

/* =====================================================
GWIAZDKI / RATING
===================================================== */

.stars{
  display:flex;
  gap:6px;
  font-size:30px;
  margin-bottom:8px;
}

.star{
  cursor:pointer;
  color:#d1d5db;
  transition:.15s ease;
}

.star.active{color:#f59e0b;}
.star:hover{transform:scale(1.15);color:#fbbf24;}

/* =====================================================
MODAL EDYCJI CEN
===================================================== */

.modal-content{
  background:linear-gradient(180deg,#13253c 0%, #102033 100%) !important;
  color:var(--station-text) !important;
  border:1px solid var(--station-border) !important;
  border-radius:18px !important;
}

.modal-header,
.modal-footer{
  border-color:var(--station-border) !important;
}

.modal-title,
.form-label,
.fuel-label,
.modal label{
  color:var(--station-text) !important;
}

.price-edit-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 0;
  border-bottom:1px solid var(--station-border) !important;
}

.price-edit-row:last-child{border-bottom:none;}
.fuel-label{font-weight:700;font-size:15px;}
.fuel-input{display:flex;align-items:center;gap:8px;color:var(--station-text-2);}
.price-input{width:90px;text-align:center;font-weight:700;font-size:16px;}
.form-control,
.price-input,
.modal input,
.modal select,
.modal textarea{
  background:#0c1727 !important;
  border:1px solid var(--station-border-strong) !important;
  color:var(--station-text) !important;
}

.form-control::placeholder,
.price-input::placeholder,
.modal input::placeholder{
  color:#8fa0b7 !important;
}

.save-prices-btn{
  font-weight:800;
  font-size:16px;
  padding:12px;
  border-radius:12px;
}

.btn-close{
  filter:invert(1) grayscale(1) brightness(200%);
}

/* =====================================================
TIMELINE — OSTATNIE AKTUALIZACJE
===================================================== */

.updates-timeline{
  position:relative;
  margin-top:22px;
  padding-left:70px;
}

.updates-timeline:before{
  content:"";
  position:absolute;
  left:32px;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(180deg,var(--station-accent),#ffb347) !important;
  border-radius:2px;
  opacity:.45 !important;
}

.station-update{
  position:relative;
  background:linear-gradient(180deg,#13253c 0%, #102033 100%) !important;
  border-radius:16px;
  border:1px solid var(--station-border) !important;
  padding:16px 18px;
  margin-bottom:16px;
  transition:all .18s ease;
  box-shadow:0 8px 20px rgba(0,0,0,.24) !important;
  animation:updateFade .3s ease;
}

.station-update:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 30px rgba(0,0,0,.3) !important;
}

.update-avatar{
  position:absolute;
  left:-52px;
  top:18px;
  width:34px;
  height:34px;
  border-radius:50%;
  background:linear-gradient(135deg,var(--station-accent),var(--station-accent-2)) !important;
  color:#fff !important;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:13px;
  box-shadow:0 0 0 4px var(--station-surface), 0 6px 14px rgba(0,0,0,.22) !important;
}

.update-content{display:flex;flex-direction:column;gap:6px;}
.update-user{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:800;
  color:var(--station-text) !important;
}

.update-user a{
  color:var(--station-text) !important;
  text-decoration:none;
}

.update-user a:hover{
  color:#ffb066 !important;
}

.update-fuels{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin-top:6px;
}

.fuel-change-box{
  font-size:14px;
  font-weight:800;
  margin-top:6px;
  color:var(--station-text) !important;
}

.fuel-change-line{
  display:flex;
  align-items:center;
  gap:6px;
  animation:fadePrice .2s ease;
}

.change-arrow{font-size:14px;}

.updates-empty{
  text-align:center;
  padding:34px 12px;
  background:linear-gradient(180deg,rgba(255,255,255,.05) 0%, rgba(255,255,255,.03) 100%) !important;
  border:1px dashed var(--station-border-strong) !important;
  border-radius:16px;
  opacity:.95;
}

.updates-empty-icon,
.updates-empty-text{
  color:var(--station-text) !important;
}

.updates-empty-icon{font-size:30px;margin-bottom:8px;}
.updates-empty-text{font-weight:800;margin-bottom:4px;}

@keyframes updateFade{
  from{opacity:0;transform:translateY(6px);}
  to{opacity:1;transform:translateY(0);}
}

@keyframes fadePrice{
  from{opacity:0;transform:translateY(3px);}
  to{opacity:1;transform:translateY(0);}
}

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

/* =========================
STATION FINAL LAYOUT
równe boxy, lżejszy grid
========================= */

body.station-page .container{
  max-width:1500px;
  margin:auto;
  padding-left:30px;
  padding-right:30px;
}

/* desktop / laptop */
.fuel-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  align-items:stretch;
  width:100%;
}

.fuel-row > *{
  min-width:0;
}

.fuel-actions-column{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-self:stretch;
  height:100%;
}

.fuel-card,
.fuel-actions-column > *{
  min-height:auto;
}

.fuel-card{
  display:flex;
  flex-direction:column;
}

.fuel-bottom{
  margin-top:auto;
}

.fuel-card{
  border-radius:18px !important;
}

.fuel-top{
  padding:20px 12px 12px;
}

.fuel-name{
  min-height:30px;
  font-size:13px;
  margin-bottom:6px;
}

.price-number{
  font-size:36px;
  line-height:1;
  letter-spacing:-1px;
}

.price-currency{
  font-size:13px;
}

.fuel-bottom,
.fuel-bottom.fuel-empty{
  padding:12px;
  gap:6px;
  font-size:12px;
}

.fuel-update,
.fuel-user,
.price-confirmations,
.price-old-warning,
.fuel-no-price,
.price-status,
.price-change{
  font-size:12px;
}

.confirm-price,
.add-price-btn{
  height:52px;
  font-size:13px;
}

.confirm-price span{
  font-size:10px;
}

.confirm-all{
  flex:1 1 auto;
  min-height:0;
  border-radius:16px;
  display:flex;
  flex-direction:column;
}

.confirm-all-top{
  flex:1 1 auto;
  min-height:0;
}

.confirm-fire{
  font-size:30px;
}

.confirm-title{
  font-size:17px;
}

.confirm-all-bottom{
  font-size:16px;
  padding:10px;
}

.edit-prices-btn{
  flex:0 0 44px;
  height:44px;
  font-size:13px;
  font-weight:800;
  border-radius:12px;
  padding:0 14px;
  box-shadow:none;
  margin-top:auto;
}

/* duży laptop */
@media (max-width:1350px){
  body.station-page .container{
    padding-left:20px;
    padding-right:20px;
  }

  .fuel-row{
    grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
    gap:10px;
  }

  .fuel-card,
  .fuel-actions-column > *{
    min-height:auto;
  }

  .fuel-top{
    padding:12px 10px 10px;
  }

  .fuel-name{
    min-height:26px;
    font-size:12px;
  }

  .price-number{
    font-size:32px;
  }

  .fuel-bottom,
  .fuel-bottom.fuel-empty{
    padding:10px;
    gap:5px;
    font-size:11px;
  }

  .fuel-update,
  .fuel-user,
  .price-confirmations,
  .price-old-warning,
  .fuel-no-price,
  .price-status,
  .price-change{
    font-size:11px;
  }

  .confirm-price,
  .add-price-btn{
    height:48px;
    font-size:12px;
  }

  .confirm-all-top{
    min-height:108px;
  }

  .confirm-fire{
    font-size:26px;
  }

  .confirm-title{
    font-size:15px;
  }

  .confirm-all-bottom{
    font-size:14px;
    padding:9px;
  }

  .edit-prices-btn{
    height:42px;
    font-size:12px;
  }
}

/* tablet */
@media (max-width:1100px){
  .fuel-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .fuel-actions-column{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
}

/* telefon */
@media (max-width:700px){
  body.station-page .container{
    max-width:100%;
    padding-left:8px;
    padding-right:8px;
  }

  .fuel-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }

  .fuel-card,
  .fuel-actions-column > *{
    min-height:auto;
  }

  .fuel-card{
    border-radius:14px !important;
  }

  .fuel-top{
    padding:10px 8px 8px;
  }

  .fuel-name{
    min-height:22px;
    font-size:11px;
    margin-bottom:4px;
  }

  .price-number{
    font-size:28px;
  }

  .price-currency{
    font-size:11px;
  }

  .fuel-bottom,
  .fuel-bottom.fuel-empty{
    padding:10px 8px;
    gap:5px;
    font-size:10px;
  }

  .fuel-update,
  .fuel-user,
  .price-confirmations,
  .price-old-warning,
  .fuel-no-price,
  .price-status,
  .price-change{
    font-size:10px;
  }

  .confirm-price,
  .add-price-btn{
    height:46px;
    font-size:11px;
    border-radius:0 0 14px 14px;
  }

  .confirm-price span{
    font-size:9px;
  }

  .fuel-actions-column{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }

  .confirm-all{
    border-radius:14px;
  }

  .confirm-all-top{
    min-height:90px;
  }

  .confirm-fire{
    font-size:24px;
  }

  .confirm-title{
    font-size:14px;
  }

  .confirm-all-bottom{
    font-size:14px;
    padding:8px;
  }

  .edit-prices-btn{
    height:40px;
    font-size:11px;
    border-radius:10px;
  }
}

/* mały telefon — nadal 2 kafle */
@media (max-width:520px){
  .fuel-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .fuel-actions-column{
    grid-template-columns:1fr 1fr;
  }
}

.guest-price-note{
    margin-bottom:14px;
    padding:12px 14px;
    border-radius:14px;
    background:rgba(255,193,7,.10);
    border:1px solid rgba(255,193,7,.22);
    color:#fff3cd;
    font-size:14px;
    line-height:1.5;
}

.guest-price-note strong{
    color:#fff;
}

.guest-price-note-user{
    background:rgba(25,135,84,.12);
    border-color:rgba(25,135,84,.28);
    color:#d1f7e5;
}

.guest-edit-hint{
    margin-top:8px;
    text-align:center;
    font-size:12px;
    line-height:1.4;
    color:rgba(255,255,255,.6);
}

.guest-inline-hint{
    margin-top:8px;
    font-size:11px;
    line-height:1.35;
    text-align:center;
    color:rgba(255,255,255,.55);
}

.btn-disabled{
    opacity:.5;
    pointer-events:none;
}

/* =========================
PAGINACJA AKTUALIZACJI
========================= */

.updates-pagination{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid var(--station-border);
}

.updates-page-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:10px 14px;
  border-radius:12px;
  text-decoration:none;
  font-weight:800;
  font-size:14px;
  color:var(--station-text) !important;
  background:linear-gradient(180deg,#13253c 0%, #102033 100%) !important;
  border:1px solid var(--station-border) !important;
  box-shadow:0 8px 20px rgba(0,0,0,.18);
  transition:all .18s ease;
}

.updates-page-btn:hover{
  transform:translateY(-1px);
  border-color:var(--station-accent) !important;
  color:#fff !important;
  box-shadow:0 12px 24px rgba(0,0,0,.24);
}

.updates-page-current{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:10px 14px;
  border-radius:12px;
  font-size:13px;
  font-weight:800;
  color:rgba(255,255,255,.78) !important;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}

@media (max-width:700px){
  .updates-pagination{
    flex-direction:column;
    align-items:stretch;
  }

  .updates-page-btn,
  .updates-page-current{
    width:100%;
    text-align:center;
  }
}

/* =========================
STATION DASHBOARD MOBILE FIX
sekcje pod cenami jedna pod drugą
========================= */

@media (max-width: 900px){
  .station-dashboard{
    grid-template-columns:1fr !important;
    gap:14px;
  }

  .station-dashboard > .card{
    width:100%;
  }

  .station-stats-grid{
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
}

@media (max-width: 640px){
  .station-dashboard{
    grid-template-columns:1fr !important;
    gap:12px;
  }

  .station-stats-grid{
    grid-template-columns:1fr;
    gap:10px;
  }

  .amenities-grid{
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .location-map iframe{
    min-height:220px;
  }

  .chart{
    height:auto;
  }

  #priceChart{
    height:110px !important;
    max-height:110px;
  }
}/* =========================
STATION DASHBOARD MOBILE FIX
sekcje jedna pod drugą
========================= */

@media (max-width: 900px){
  .station-dashboard{
    grid-template-columns:1fr !important;
    gap:14px;
  }

  .station-dashboard > .card{
    width:100%;
  }

  .station-stats-grid{
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
}

@media (max-width: 640px){
  .station-dashboard{
    grid-template-columns:1fr !important;
    gap:12px;
  }

  .station-stats-grid{
    grid-template-columns:1fr;
    gap:10px;
  }

  .amenities-grid{
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .location-map iframe{
    min-height:220px;
  }

  .chart{
    height:auto;
  }

  #priceChart{
    height:110px !important;
    max-height:110px;
  }
}

/* =====================================================
STATION MOBILE FIX — top buttons + action box
WKLEJ NA KONIEC station-new.css
===================================================== */

@media (max-width: 700px){

  /* ---------- GÓRA: 3 przyciski w jednej linii ---------- */

  .prices-header{
    gap:12px;
  }

  .prices-station{
    width:100%;
    align-items:center;
    gap:12px;
  }

  .prices-logo{
    width:58px;
    height:58px;
    border-radius:16px;
  }

  .prices-logo img{
    max-width:38px;
    max-height:38px;
  }

  .station-address{
    font-size:13px;
    line-height:1.35;
  }

  .prices-actions{
    width:100%;
    display:flex;
    flex-wrap:nowrap;      /* KLUCZOWE */
    gap:8px;
    align-items:stretch;
  }

  .prices-actions > *{
    min-width:0;
    flex:1 1 0;
  }

  .nav-small,
  .favorite-btn{
    min-width:0;
    width:100%;
    height:48px;
    padding:0 10px;
    border-radius:12px;
  }

  .nav-content,
  .favorite-btn{
    font-size:12px;
    font-weight:800;
    justify-content:center;
    text-align:center;
    white-space:nowrap;
  }

  .favorite-btn .fav-icon{
    font-size:13px;
  }

  .favorite-btn .fav-text{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  /* ---------- DÓŁ: akcje jako JEDEN pionowy box ---------- */

  .fuel-actions-column{
    grid-column:auto;              /* ważne: nie rozciągaj na cały rząd */
    display:flex !important;
    flex-direction:column !important;
    gap:8px;
    align-self:stretch;
    height:100%;
  }

  .fuel-actions-column > *{
    width:100%;
  }

  .confirm-all{
    border-radius:14px;
    min-height:0;
    overflow:hidden;
  }

  .confirm-all-top{
    min-height:88px;
    padding:10px 8px;
  }

  .confirm-fire{
    font-size:22px;
    margin-bottom:4px;
  }

  .confirm-title{
    font-size:14px;
    line-height:1.15;
  }

  .confirm-all-bottom{
    font-size:12px;
    padding:8px;
  }

  .edit-prices-btn{
    height:42px;
    min-height:42px;
    border-radius:12px;
    font-size:12px;
    padding:0 10px;
    margin-top:0;
  }

  /* ---------- same kafle paliw lekko ciaśniej ---------- */

  .fuel-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:stretch;
  }

  .fuel-card{
    border-radius:14px !important;
  }

  .fuel-top{
    padding:10px 8px 8px;
  }

  .fuel-name{
    min-height:24px;
    font-size:11px;
    line-height:1.15;
    margin-bottom:4px;
  }

  .price-number{
    font-size:28px;
  }

  .price-currency{
    font-size:11px;
    margin-bottom:2px;
  }

  .fuel-bottom,
  .fuel-bottom.fuel-empty{
    padding:10px 8px;
    gap:5px;
  }

  .fuel-update,
  .fuel-user,
  .price-confirmations,
  .price-old-warning,
  .fuel-no-price,
  .price-status,
  .price-change{
    font-size:10px;
    line-height:1.25;
  }

  .confirm-price,
  .add-price-btn{
    height:44px;
    font-size:11px;
    border-radius:0 0 14px 14px;
  }

  .confirm-price span{
    font-size:9px;
  }

  /* badge "Twoje paliwo" trochę mniejszy */
  .fuel-user-highlight::after{
    top:0;
    right:0;
    font-size:9px;
    padding:4px 7px;
  }
}


/* =====================================================
BARDZO MAŁE TELEFONY
===================================================== */
@media (max-width: 420px){

  .prices-actions{
    gap:6px;
  }

  .nav-small,
  .favorite-btn{
    height:44px;
    padding:0 8px;
    border-radius:10px;
  }

  .nav-content,
  .favorite-btn{
    font-size:11px;
  }

  .station-address{
    font-size:12px;
  }

  .confirm-title{
    font-size:13px;
  }

  .confirm-all-bottom{
    font-size:11px;
  }

  .edit-prices-btn{
    font-size:11px;
    height:40px;
    min-height:40px;
  }
}

/* ===== BREADCRUMBS ===== */
.tn-breadcrumbs-wrap{
    margin: 16px 0 18px;
}

.tn-breadcrumbs{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
    font-size:14px;
    line-height:1.4;
    color:#9fb0c3;
    background:rgba(10,18,30,.72);
    border:1px solid rgba(255,255,255,.08);
    border-radius:14px;
    padding:10px 14px;
    backdrop-filter: blur(8px);
}

.tn-breadcrumbs a{
    color:#d9e7f5;
    text-decoration:none;
    transition:.2s ease;
}

.tn-breadcrumbs a:hover{
    color:#ffc107;
}

.tn-breadcrumbs-sep{
    opacity:.55;
}

.tn-breadcrumbs-current{
    color:#ffffff;
    font-weight:600;
}

@media (max-width: 768px){
    .tn-breadcrumbs{
        font-size:13px;
        gap:6px;
        padding:9px 12px;
        border-radius:12px;
    }

    .tn-breadcrumbs-wrap{
        margin: 12px 0 14px;
    }
}