/* advtracks v0.3.1a (restored full styles) */
:root { --bg:#0f1216; --panel:#151a20; --text:#e5e7eb; --muted:#9ca3af; --accent:#f97316; --chip:#222831;
 --green:#4caf50; --yellow:#cddc39; --orange:#ff9800; --red:#f44336; --black:#111; }
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;}
/* Beta tag */
.beta-tag{font-size:0.65em;background:var(--accent);color:#fff;padding:1px 4px;border-radius:3px;vertical-align:super;margin-left:2px;font-weight:600}
/* Header / Footer */
.site-header,.site-footer{padding:14px 18px;background:var(--panel);display:flex;align-items:center;justify-content:space-between;gap:12px}
.site-footer{
  flex-direction:column;
  gap:8px;
  text-align:center;
  border-top:1px solid #2a2f36;
  padding:16px 18px;
}
.footer-content{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  max-width:800px;
  margin:0 auto;
}
.footer-brand{
  color:var(--text);
  font-weight:600;
}
.footer-links{
  display:flex;
  gap:8px;
  align-items:center;
}
.footer-links a{
  color:var(--accent);
  text-decoration:none;
}
.footer-links a:hover{
  text-decoration:underline;
}
.footer-links .sep{
  color:var(--muted);
}
.osm-attribution{
  font-size:0.75rem;
  color:var(--muted);
  line-height:1.4;
}
.osm-attribution a{
  color:var(--accent);
  text-decoration:none;
}
.osm-attribution a:hover{
  text-decoration:underline;
}
.site-header.big .brand-row{display:flex;align-items:center;gap:12px}
.logo{height:40px;width:auto}
.brand{font-weight:800;font-size:1.6rem}.ver{font-size:.9rem;color:var(--muted);margin-left:6px}
.site-nav a{color:var(--text);text-decoration:none;margin-left:12px}

/* Layout */
.layout{display:grid;grid-template-columns:1fr 380px;gap:12px;padding:12px}
#map{width:100%;height:78vh;border-radius:12px;overflow:hidden;box-shadow:0 2px 16px rgba(0,0,0,.35);position:relative}
.map-controls{position:absolute;top:12px;left:12px;z-index:5000}
.map-controls button{background:var(--panel);border:1px solid #2a2f36;color:var(--text);padding:6px 10px;border-radius:8px;cursor:pointer}
.map-instructions{background:var(--panel);padding:12px;border-radius:8px;margin-top:12px;border:1px solid #2a2f36}
.map-instructions p{margin:0;font-size:0.85em;color:#999;line-height:1.4}

/* Sidebar / Cards */
.sidebar .card{background:var(--panel);padding:12px;border-radius:12px;margin-bottom:12px}
.sidebar h3{margin:0 0 8px 0}
.list-links a{color:var(--accent);text-decoration:none}
.list-links a:hover{text-decoration:underline}

/* Ads */
/* Ensure ad banners render at intended 1200x200 without cropping */
.ad-top,.ad-bottom{display:block;width:100%;background:#0b0b0c;text-align:center}
.ad-top a,.ad-bottom a{display:inline-block}
.ad-top img,.ad-bottom img{
	width:100%;
	max-width:1200px;
	height:200px; /* fixed banner slot height */
	object-fit:scale-down; /* prefer original size; fallback to contain without cropping */
	border-radius:0
}

/* Containers / Tables / Forms */
.container{max-width:960px;margin:24px auto;padding:20px;background:var(--panel);border-radius:12px}
table{width:100%;border-collapse:collapse}
th,td{padding:10px;border-bottom:1px solid #2a2f36}
label{display:block;margin:8px 0}
input,select,textarea,button{width:100%;padding:10px;border-radius:8px;border:1px solid #2a2f36;background:#0f1115;color:#e5e7eb}
.btn{display:inline-block;background:var(--accent);border:none;color:#fff;padding:8px 12px;border-radius:8px;text-decoration:none}
.btn.secondary{background:#39414a}.btn.danger{background:#b3261e}
.alert{background:#3b1f1f;color:#ffb4b4;padding:8px;border-radius:8px;margin:8px 0}

/* Admin Nav */
.nav{background:var(--panel);padding:10px 14px;display:flex;gap:12px;align-items:center;border-bottom:1px solid #2a2f36}
.nav a{color:var(--text);text-decoration:none;padding:6px 10px;border-radius:8px;background:#0f1115;border:1px solid #2a2f36}
.nav a.right{margin-left:auto}

/* Grid helpers */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}

/* Legend chips */
.legend{list-style:none;padding:0;margin:0}
.legend li{display:flex;align-items:center;gap:8px;margin:4px 0}
.legend .legend-chip{display:inline-block;width:16px;height:16px;border-radius:4px}
.difficulty-1{background:var(--green);color:#000;padding:2px 8px;border-radius:999px}
.difficulty-2{background:var(--yellow);color:#000;padding:2px 8px;border-radius:999px}
.difficulty-3{background:var(--orange);color:#000;padding:2px 8px;border-radius:999px}
.difficulty-4{background:var(--red);color:#fff;padding:2px 8px;border-radius:999px}
.difficulty-5{background:var(--black);color:#fff;padding:2px 8px;border-radius:999px}

/* Featured list spacing (fix) */
.featured-list a{ color:var(--text); text-decoration:none }
.featured-list a:hover{ text-decoration:underline }

/* New structure for featured items: chip + linked title on same line */
.featured-item{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.featured-list .featured-link{display:inline}
.featured-item .featured-link{color:var(--text);text-decoration:none}
.featured-item .featured-link:hover{text-decoration:underline}

/* Track selection popup for overlapping tracks */
.leaflet-popup-content-wrapper {
  background: var(--panel);
  color: var(--text);
  border: 1px solid #2a2f36;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.5);
}
.leaflet-popup-tip {
  background: var(--panel);
  border: 1px solid #2a2f36;
}
/* Track Selection Sidebar */
.track-selection-sidebar {
  padding: 12px;
}
.track-selection-sidebar h3 {
  margin: 0 0 8px 0;
  font-size: 1.1rem;
  color: var(--accent);
}
.track-selection-sidebar p {
  margin: 4px 0 12px 0;
  font-size: 0.9rem;
  color: var(--muted);
}
.track-selection-sidebar .track-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.track-selection-sidebar .track-choice {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  background: rgba(255,255,255,0.05);
  border: 1px solid #2a2f36;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.2s;
}
.track-selection-sidebar .track-choice:hover {
  background: rgba(249, 115, 22, 0.15);
  border-color: var(--accent);
  transform: translateX(4px);
}
.track-selection-sidebar .track-title {
  flex: 1;
  font-size: 0.95rem;
}

/* Leaflet Layer Control - Dark Theme */
.leaflet-control-layers {
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.4) !important;
}
.leaflet-control-layers-toggle {
  width: 36px !important;
  height: 36px !important;
  background-color: var(--panel) !important;
  border-radius: 8px !important;
}
.leaflet-control-layers-expanded {
  background: var(--panel) !important;
  color: var(--text) !important;
  padding: 8px 12px !important;
}
.leaflet-control-layers-selector {
  accent-color: var(--accent) !important;
}
.leaflet-control-layers-separator {
  border-top-color: #2a2f36 !important;
  margin: 6px 0 !important;
}

/* Events Styles */
.events-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.event-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid #2a2f36;
}
.event-item:last-child {
  border-bottom: none;
}
.event-item .event-star {
  color: var(--accent);
  font-size: 1em;
}
.event-item-date {
  background: var(--accent);
  color: #fff;
  font-size: 0.85em;
  padding: 2px 8px;
  border-radius: 999px;
  font-weight: 600;
  white-space: nowrap;
}
.event-link {
  color: var(--text);
  text-decoration: none;
  flex: 1;
}
.event-link:hover {
  text-decoration: underline;
}

/* Event map markers */
.event-marker {
  background: transparent;
}
.event-pin {
  position: relative;
  width: 30px;
  height: 40px;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}
.event-pin-icon {
  font-size: 20px;
  filter: drop-shadow(0 2px 3px rgba(0,0,0,0.4));
}
.event-pin .event-star {
  position: absolute;
  top: -4px;
  right: -4px;
  color: #f97316;
  font-size: 14px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

/* Event details in sidebar */
.event-details {
  padding: 4px 0;
}
.event-details h2 {
  margin: 0 0 16px 0;
  font-size: 1.25em;
  line-height: 1.3;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  padding-bottom: 12px;
}
.event-featured-star {
  color: var(--accent);
}
.event-meta-row {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.event-date-badge {
  background: var(--accent);
  color: #fff;
  padding: 4px 10px;
  border-radius: 6px;
  display: inline-flex;
  align-items: center;
  font-size: 0.9em;
}
.event-date-badge .event-date {
  font-weight: 600;
}
.event-date-badge .event-time {
  margin-left: 8px;
  opacity: 0.9;
}
.event-diff-easy { background: var(--green); color: #000; padding: 4px 10px; border-radius: 6px; font-size: 0.9em; }
.event-diff-moderate { background: var(--yellow); color: #000; padding: 4px 10px; border-radius: 6px; font-size: 0.9em; }
.event-diff-challenging { background: var(--orange); color: #000; padding: 4px 10px; border-radius: 6px; font-size: 0.9em; }
.event-diff-expert { background: var(--red); color: #fff; padding: 4px 10px; border-radius: 6px; font-size: 0.9em; }
.event-details .track-meta {
  color: rgba(255,255,255,0.7);
  font-size: 0.9em;
  margin-bottom: 12px;
}
.event-description {
  line-height: 1.6;
  margin: 0 0 16px 0;
  white-space: pre-wrap;
  font-size: 0.95em;
  color: rgba(255,255,255,0.85);
}
.event-location, .event-contact {
  margin: 16px 0;
  padding: 12px;
  background: rgba(255,255,255,0.08);
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.1);
}
.event-location h4, .event-contact h4 {
  margin: 0 0 6px 0;
  font-size: 0.8em;
  color: rgba(255,255,255,0.5);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.event-location p, .event-contact p {
  margin: 0 0 10px 0;
  color: var(--text);
  font-size: 0.95em;
}
.event-location .btn {
  margin-top: 4px;
}
.event-contact a {
  color: var(--accent);
  text-decoration: none;
}
.event-contact a:hover {
  text-decoration: underline;
}
.event-links {
  margin-top: 16px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}