/* A restrained visual system: depth comes from contrast, light and motion rather than decoration. */
body{background:#06262e}.main{background:linear-gradient(135deg,#f7fbfb 0%,#f2f7f7 55%,#eaf3f3 100%)}.sidebar{background:radial-gradient(circle at 20% 0,#0d5966 0,transparent 30%),linear-gradient(170deg,#073841,#041d24 73%);box-shadow:14px 0 40px #00191e55}.sidebar:after{
content:'';
position:absolute;
left:18px;
right:18px;
bottom:0;
height:130px;
opacity:.25;
background:
  radial-gradient(100% 75% at 50% 100%,#18b9ce22 0%,transparent 70%),
  linear-gradient(90deg,transparent,rgba(45,213,233,.14),transparent);
pointer-events:none;
}.sidebar>*{position:relative;z-index:1}.brand{padding:0 4px 19px;border-bottom:1px solid #3b6268}.nav-caption{color:#6ea6af;font-size:9px;letter-spacing:1.5px;font-weight:bold;margin:21px 11px 5px}.nav-item{transition:background .2s ease,color .2s ease,transform .2s ease}.nav-item:hover{transform:translateX(3px)}.nav-item.active{box-shadow:inset 3px 0 #22d5e8,0 6px 16px #001d2488}.topbar{background:#ffffffed;backdrop-filter:blur(14px);box-shadow:0 1px 0 #dbe8e8,0 6px 16px #062b3305}.topbar:after{content:'';height:2px;position:absolute;bottom:0;left:0;right:0;background:linear-gradient(90deg,transparent,#11bdd4 38%,transparent 70%);opacity:.45}.dashboard,.page{animation:rise .32s ease both}.hero{box-shadow:0 18px 40px #06333b28}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 48%,#36d7e40c 49%,transparent 50%);pointer-events:none}.quick-actions{transition:transform .2s,box-shadow .2s}.quick-actions:hover{transform:translateY(-2px);box-shadow:0 17px 35px #062b3320}.quick-actions button{transition:.18s}.quick-actions button:hover{color:#008ba2;transform:translateY(-2px)}.news-card,.event-card,.panel,.map-card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.news-card:hover,.event-card:hover{transform:translateY(-4px);box-shadow:0 17px 33px #06313a24;border-color:#93dbe2}.panel:hover,.map-card:hover{box-shadow:0 17px 32px #062b331b}.departure{transition:background .16s,padding .16s}.departure:hover{background:#edf8f8;padding-left:7px;padding-right:7px;border-radius:6px}.mock-map{filter:saturate(1.1) contrast(1.02)}.mock-map:after{content:'';position:absolute;inset:0;background:linear-gradient(#0b63700b 1px,transparent 1px),linear-gradient(90deg,#0b63700b 1px,transparent 1px);background-size:38px 38px;pointer-events:none}.pin{z-index:1;cursor:pointer;transition:transform .2s,filter .2s}.pin:hover{transform:rotate(-45deg) scale(1.15);filter:brightness(1.1);z-index:3}.full-map{background:#dcefed}.large-map{position:relative}.map-sidebar{background:#fffffffa}.map-search{border:1px solid #dbe8e9;border-radius:7px;padding:8px 10px;display:flex;gap:7px;color:#4a7379;margin:17px 0}.map-search input{border:0;outline:0;width:100%;font:12px inherit}.map-legend{border-top:1px solid #e6eeee;margin-top:14px;padding-top:12px;display:grid;gap:7px;font-size:10px;color:#69848a}.map-legend i{height:8px;width:8px;border-radius:50%;display:inline-block;margin-right:5px}.bus-dot{background:#10bfd5}.stop-dot{background:#123f47}.map-float{position:absolute;z-index:3;right:18px;top:18px;display:grid;box-shadow:0 6px 20px #062a3050;border-radius:8px;overflow:hidden}.map-float button{height:35px;width:35px;border:0;border-bottom:1px solid #dfeaea;background:#fff;color:#07505d;font-size:18px;cursor:pointer}.map-route-label{position:absolute;right:15%;bottom:22%;z-index:2;background:#053f49;color:#fff;border-radius:6px;padding:6px 9px;font-size:11px;box-shadow:0 5px 12px #03242a55}.menu-scrim{display:none}@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:700px){.sidebar{display:flex;z-index:20;width:260px;transform:translateX(-105%);transition:transform .26s ease}.menu-open .sidebar{transform:translateX(0)}.menu-open .menu-scrim{display:block;position:fixed;z-index:19;inset:0;border:0;background:#001c2390}.menu-open .sidebar .brand small,.menu-open .sidebar .nav-item span,.menu-open .side-weather div,.menu-open .settings{display:block}.menu-open .sidebar .logo b,.menu-open .sidebar .logo strong{display:inline}.menu-open .sidebar .nav-item{justify-content:flex-start}.nav-caption{display:block}.map-search,.map-legend{display:none}.map-float{right:12px;top:12px}.map-route-label{bottom:35%;right:12%}.event-filters{margin-top:-5px}.notification-button i{border-color:white}}

.sidebar:before{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:110px;
  opacity:.30;
  pointer-events:none;
  background:
    linear-gradient(170deg,transparent 0 69%,rgba(48,211,229,.13) 69.2% 69.8%,transparent 70%),
    linear-gradient(12deg,transparent 0 78%,rgba(48,211,229,.09) 78.2% 78.8%,transparent 79%);
}


/* =========================================================
   EGERSZEGGO FINAL POLISH – LAST-LAYER OVERRIDES
   This file is intentionally loaded after styles.css.
   Navigation layout is untouched; desktop shell is fixed here.
   ========================================================= */

/* ---------- SIDEBAR / BACKGROUND ---------- */
body .app-shell > .sidebar {
  background:
    radial-gradient(95% 42% at 22% 0%, rgba(23, 190, 212, .11), transparent 68%),
    radial-gradient(75% 45% at 100% 100%, rgba(11, 130, 151, .10), transparent 72%),
    linear-gradient(180deg, #07343d 0%, #062b33 54%, #05262d 100%) !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

/* Keep a subtle upper decorative line system. */
body .app-shell > .sidebar::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  opacity: .24 !important;
  background:
    linear-gradient(154deg, transparent 0 24%, rgba(74, 218, 235, .18) 24.12% 24.38%, transparent 24.52%),
    linear-gradient(26deg, transparent 0 36%, rgba(74, 218, 235, .12) 36.14% 36.40%, transparent 36.54%),
    linear-gradient(151deg, transparent 0 46%, rgba(74, 218, 235, .08) 46.12% 46.36%, transparent 46.52%),
    radial-gradient(90% 25% at 50% 0%, rgba(74, 218, 235, .07), transparent 75%);
}

/* Lower section: continuous, calm topographic arcs. */
body .app-shell > .sidebar::after {
  content: "" !important;
  position: absolute !important;
  left: -15% !important;
  right: -15% !important;
  bottom: -12px !important;
  height: 235px !important;
  z-index: -1 !important;
  pointer-events: none !important;
  opacity: .34 !important;
  background:
    radial-gradient(
      ellipse 92% 118% at 49% 118%,
      transparent 0 62%,
      rgba(53, 211, 230, .15) 62.25% 62.58%,
      transparent 62.9%
    ),
    radial-gradient(
      ellipse 76% 98% at 53% 135%,
      transparent 0 68%,
      rgba(53, 211, 230, .10) 68.2% 68.52%,
      transparent 68.85%
    ),
    radial-gradient(
      ellipse 57% 79% at 56% 153%,
      transparent 0 72%,
      rgba(53, 211, 230, .08) 72.2% 72.52%,
      transparent 72.86%
    );
}

/* ---------- FULL-SCREEN DESKTOP LAYOUT ----------
   Fix the area that the earlier styles.css could not win against. */
@media (min-width: 1200px) {

  body .main {
    width: calc(100vw - 252px) !important;
    margin-left: 252px !important;
  }

  body .topbar {
    width: 100% !important;
    min-height: 72px !important;
    padding: 0 30px !important;
  }

  body .dashboard,
  body .page {
    width: calc(100% - 56px) !important;
    max-width: 1560px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-top: 28px !important;
  }

  /* Balanced desktop proportions */
  body .home-layout {
    grid-template-columns: minmax(0, 1fr) 368px !important;
    gap: 24px !important;
  }

  body .hero {
    min-height: 286px !important;
  }

  body .hero h1 {
    font-size: clamp(42px, 3.15vw, 54px) !important;
  }

  body .quick-actions {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }

  body .lead-news,
  body .lead-news img {
    min-height: 360px !important;
    height: 360px !important;
  }

  body .news-card img {
    height: 150px !important;
  }

  body .section-heading h2,
  body .panel h2 {
    font-size: 20px !important;
  }

  /* Stop the page from looking like a narrow centered tablet on a big monitor. */
  body #content {
    width: 100% !important;
  }
}

@media (min-width: 1600px) {
  body .dashboard,
  body .page {
    width: calc(100% - 72px) !important;
    max-width: 1680px !important;
  }

  body .home-layout {
    grid-template-columns: minmax(0, 1fr) 390px !important;
    gap: 28px !important;
  }

  body .hero {
    min-height: 300px !important;
  }

  body .lead-news,
  body .lead-news img {
    min-height: 390px !important;
    height: 390px !important;
  }
}

/* ---------- NAV: preserve current structure, only polish interaction ---------- */
body .sidebar .nav-item {
  transition:
    background-color .20s ease,
    color .20s ease,
    border-color .20s ease,
    transform .20s cubic-bezier(.2,.8,.2,1),
    box-shadow .20s ease !important;
}

body .sidebar .nav-item:hover {
  transform: translateX(3px) !important;
  background: rgba(20, 188, 211, .10) !important;
  color: #f2fcfd !important;
}

body .sidebar .nav-item.active {
  box-shadow:
    inset 3px 0 #22d5e8,
    0 6px 16px rgba(0, 29, 36, .30) !important;
}

/* ---------- FILTERS ---------- */
body .news-toolbar .filters {
  flex-wrap: wrap !important;
  overflow: visible !important;
}

body .news-toolbar .filters button {
  min-height: 38px !important;
  padding: 0 15px !important;
  border: 1px solid #d1e1e2 !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #35575d !important;
}

body .news-toolbar .filters button.selected {
  background: #073f49 !important;
  border-color: #073f49 !important;
  color: #fff !important;
}

body .news-toolbar select {
  min-height: 38px !important;
  border-radius: 999px !important;
}

/* ---------- NO HORIZONTAL OVERFLOW ---------- */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

@media (prefers-reduced-motion: reduce) {
  body .sidebar .nav-item {
    transition: none !important;
  }
}