/* ============================================================
   DemoDrop Sidebar — #top-menu
   CSS verbatim from original combined.min.css (demodrop.com)
   Exact replica — do not modify
   ============================================================ */

/* ── Font Awesome base (needed for hamburger + search icon) ── */
.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.fa-bars:before { content: "\f0c9"; }

/* ── Reset verbatim from combined.min.css ── */
a, div, form, i, img, li, nav, ol, span, ul {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
nav { display: block; }
ol, ul { list-style: none; }

/* ── Input inside sidebar search ── */
input[type=text] {
  padding: 9px 8px;
  margin: 2px 0;
  background-color: #fff;
  border: 2px solid rgba(0,0,0,.15);
  border-radius: 3px;
  font-family: inherit;
  font-size: inherit;
  vertical-align: middle;
  background-color: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.1);
  color: #eee;
  border: none;
  line-height: 20px;
}
input:focus { outline: 0; }

/* ── Logo ── */
#logo {
  height: 60px;
  padding: 0px 5px 0px;
}

/* ── Search bar ── */
#main-search { position: relative; }
#main-search > input {
  width: 140px;
  font-size: 14px;
  font-family: inherit;
  border: 1px solid #333;
  color: #fff;
  padding: 8px;
  margin: 5px 10px 0 10px;
  vertical-align: baseline;
  border-radius: 3px;
  transition: width .3s ease-in-out;
  background: transparent;
}
#main-search:before {
  font-family: FontAwesome;
  display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  position: absolute;
  left: 140px;
  top: 18px;
  color: #fff;
  text-shadow: none;
  content: '\f002';
}
#main-search > input:focus {
  background-color: #fff;
  color: #333;
}

/* ── Headway badge ── */
#HW_badge_cont {
  position: absolute !important;
  top: 0;
  left: 140px;
}

/* ── Tourbus / promos ── */
.tourbus-legs { display: none; }

/* ── Detail / footer links ── */
.detail { color: #999; }
.detail a { border-bottom-color: #999 !important; }
.center { text-align: center; }
.hide { display: none; }

/* ── HR dividers ── */
hr {
  border: none;
  border-top: 1px solid rgba(0,0,0,.1);
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 0;
  margin: 10px 0;
}
hr.dark { border-top: 1px solid rgba(255,255,255,.1); }

/* ── Utility ── */
.f12 { font-size: 12px !important; }

/* ── Links ── */
a, a:active, a:link, a:visited {
  cursor: pointer;
  color: inherit;
  text-decoration: none;
}
a:hover { color: #ff0084; }
a:hover { border-color: #ff0084; }
.dark { color: #333; }

/* ── #top-menu — exact replica ── */
#top-menu {
  top: 0;
  left: 0;
  width: 180px;
  position: fixed;
  z-index: 5;
  background-color: #1d2729;
  box-shadow: 0 0 5px rgba(0,0,0,.3);
  height: 100%;
  transition: height .3s ease-in-out;
  overflow: auto;
  overflow-x: hidden;
  overflow-y: auto;
}

/* ── Menu list ── */
#top-menu-ul { white-space: nowrap; }
#top-menu-ul > li { display: block; }
#top-menu-ul > li:first-child { margin-right: 20px; }
#top-menu-ul > li > a {
  display: block;
  font-size: 14px;
  padding: 10px 15px 10px 20px;
  position: relative;
  color: #ccc;
  border-left: 3px solid rgba(255,255,255,.1);
}

/* hover */
#top-menu-ul > li a[href]:hover {
  background-color: rgba(255,255,255,.1);
  color: #fff;
}

/* active state */
#top-menu-ul > li.active > a,
#top-menu-ul > li a.active {
  color: #fff;
  font-weight: 600;
  border-left: 3px solid #e30d7f;
}

/* data-count badge */
#top-menu-ul > li a[data-count]:after {
  content: attr(data-count);
  background-color: rgba(50,50,50,.5);
  border-radius: 2px;
  color: #eee;
  font-size: 90%;
  padding: 2px 5px;
  line-height: normal;
  margin-left: 4px;
  float: right;
}
#top-menu-ul > li a[data-count="0"]:after,
#top-menu-ul > li a[data-count=""]:after { display: none; }
#top-menu-ul > li a[data-new]:after { color: #fff; background-color: #f03d25; }

/* ── Footer detail block ── */
#top-menu .detail { color: #999; font-size: 12px; }
#top-menu .detail a { border-bottom-color: #999 !important; color: #999; }
#top-menu .detail a:hover { color: #ff0084; }
#top-menu .center { text-align: center; }

/* ── HR inside nav ── */
nav#top-menu hr {
  border: none;
  border-top: 1px solid rgba(0,0,0,.1);
  border-bottom: 1px solid rgba(255,255,255,.1);
  padding: 0;
  margin: 10px 0;
}
nav#top-menu hr.dark { border-top: 1px solid rgba(255,255,255,.1); }

/* ── Handheld / responsive ── */
.show-on-handheld { display: none; }
#top-menu-ul > li.hamburger-menu { display: none; }

@media screen and (max-width: 815px) {
  #main-search { display: none; }
  #top-menu { left: -180px; }
}

@media (max-width: 600px) {
  .hide-on-handheld { display: none !important; }
  #top-menu {
    position: fixed;
    top: 0;
    left: -70%;
    left: -70vw;
    width: 70%;
    width: 70vw;
    overflow: visible;
    transition: left .3s;
  }
  #top-menu-ul {
    position: absolute;
    width: 100%;
    min-height: 100%;
    background-color: #1d1d1d;
  }
  #top-menu-ul > li { float: none; display: block; }
  #top-menu-ul > li > a {
    padding: 20px 20px;
    font-size: 1.2em;
    border-bottom: 1px solid rgba(255,255,255,.1);
  }
  .show-on-handheld { display: block; }
  #top-menu-ul > li.hamburger-menu {
    float: right;
    display: inline-block;
    font-size: 18px;
    margin-right: -50px;
  }
  #top-menu-ul > li.hamburger-menu a { padding: 15px 15px; border: none; }
}

/* ── HW badge (Headway changelog widget) ── */
.HW_badge_cont {
  visibility: hidden;
  pointer-events: none;
  display: block;
  cursor: pointer;
  position: relative;
  width: 32px;
  height: 32px;
}
.HW_badge {
  display: block;
  border-radius: 20px;
  background: #CD4B5B;
  height: 16px;
  width: 16px;
  color: #fff;
  text-align: center;
  line-height: 16px;
  font-size: 11px;
  cursor: pointer;
  position: absolute;
  top: 8px;
  left: 8px;
  opacity: 0;
  will-change: scale;
  transform: scale(0);
  transition: all 0.3s;
}

/* ── FontAwesome font-face ── */
@font-face {
  font-family: 'FontAwesome';
  src: url('../css/fontawesome/fontawesome-webfont.eot?v=4.7.0');
  src: url('../css/fontawesome/fontawesome-webfont.eot#iefix&v=4.7.0') format('embedded-opentype'),
       url('../css/fontawesome/fontawesome-webfont.woff2?v=4.7.0') format('woff2'),
       url('../css/fontawesome/fontawesome-webfont.woff?v=4.7.0') format('woff'),
       url('../css/fontawesome/fontawesome-webfont.ttf?v=4.7.0') format('truetype'),
       url('../css/fontawesome/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* Hide SVGs inside the sidebar navigation links */
#top-menu-ul.sections > li > a > svg {
  display: none !important;
}