/* atlas-sidebar.css — Shared Sidebar-Convergence-Pattern fuer alle 4 Karten.
   Konvention: .atl-sec (Container) > .atl-sec-h (klappbarer Header) > .atl-sec-list
               > [.atl-sec-src (Quellen-Label)] + .atl-sec-item *.
   Eingebunden in de_1km / de_10km / bl_3d / kreis_3d. */

.atl-sec { margin-top:6px; }

.atl-sec-h {
  font-size:12px; line-height:1.8; color:#9fc8ff;
  text-transform:uppercase; letter-spacing:.4px; font-weight:200;
  padding:6px 4px; border-bottom:1px solid rgba(255,255,255,.06);
  cursor:pointer; user-select:none;
  display:flex; align-items:center; justify-content:space-between; gap:6px;
  transition:.12s;
  white-space:nowrap; min-width:0;
}
.atl-sec-h > span:first-child {
  flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis;
}
.atl-sec-h:hover { color:#fff; background:rgba(74,144,226,.08); border-radius:3px; }
.atl-sec-h .atl-sec-cnt { color:#9fb3d1; font-size:12px; font-weight:500; letter-spacing:0; }
.atl-sec-h .chev,
.atl-sec-h .chevron { font-size:12px; color:#7da2d4; transition:transform .15s; flex-shrink:0; }

.atl-sec.collapsed .atl-sec-list { display:none; }
.atl-sec.collapsed .chev,
.atl-sec.collapsed .chevron { transform:rotate(-90deg); }
.atl-sec.collapsed .atl-sec-h { border-bottom:none; }

.atl-sec-list { padding-top:3px; display:flex; flex-direction:column; gap:0; }

.atl-sec-src {
  font-size:12px; color:#7da2d4; font-weight:400;
  text-transform:none; letter-spacing:0;
  padding:2px 4px 4px; opacity:.7;
}

.atl-sec-item {
  display:flex; gap:6px; align-items:center;
  padding:6px 8px; border-radius:4px;
  cursor:pointer; font-size:12px; color:#cdd9ec;
  font-weight:100; letter-spacing:.3px;   /* Typo-Familie wie .atl-sec-h (Stufe 3c), ohne Uppercase */
  transition:.12s; line-height:1.35;
}
/* Sprite-Icons in Indikator-Zeilen: 14px, Soft-Ton — aktiv/hover Primary wie Kategorie-Ebene */
.atl-sec-item .atl-ic { width:14px; height:14px; color:var(--atl-text-soft, #9fb3d1); flex:0 0 auto; }
.atl-sec-item:hover .atl-ic, .atl-sec-item.active .atl-ic { color:var(--atl-primary, #9fc8ff); }
.atl-sec-item:hover { background:rgba(74,144,226,.12); }
.atl-sec-item.active {
  background:rgba(74,144,226,.32); color:#fff; font-weight:600;
  box-shadow:inset 2px 0 0 #9fc8ff;
}
.atl-sec-item .ein { font-size:12px; color:#7d8ba0; margin-left:auto; }
.atl-sec-item.pro-locked {
  color:#7d8aa2; opacity:.72; position:relative; padding-right:22px;
}
.atl-sec-item.pro-locked::after {
  content:'🔒'; position:absolute; right:6px; top:50%;
  transform:translateY(-50%); font-size:12px; opacity:.7; transition:.12s;
}
.atl-sec-item.pro-locked:hover { background:rgba(255,180,90,.10); color:#ffc080; }
.atl-sec-item.pro-locked:hover::after { opacity:1; }

/* Falls Items als <button> gerendert sind (Altbestand): native Button-Styles neutralisieren. */
button.atl-sec-item {
  width:100%; text-align:left; background:none; border:none;
  font-family:inherit;
}

/* Section-Wrapper (z.B. de_10km section-block als innere Quellen-Gruppe) */
.atl-sec-sub { padding:2px 0 4px; }

/* ===== Bundeslaender-Filter-Grid (de_1km + de_10km) ===== */
.bl-grp-h {
  font-size:12px; color:#9fc8ff; text-transform:uppercase; letter-spacing:.4px;
  font-weight:200; padding:8px 4px 4px; margin-top:8px;
  display:flex; justify-content:space-between; align-items:center; gap:4px;
  white-space:nowrap;
}
/* Alle/Keine nebeneinander halten (User-Feedback 2026-07-13) */
.bl-grp-h > span { display:flex; gap:3px; flex-shrink:0; }
.bl-grp-h .bl-mini {
  background:transparent; color:#7da2d4; border:1px solid rgba(120,160,220,.3);
  font-size:12px; padding:2px 7px; border-radius:3px; cursor:pointer;
  font-family:inherit; font-weight:600; letter-spacing:0; transition:.12s;
}
.bl-grp-h .bl-mini + .bl-mini { margin-left:3px; }
.bl-grp-h .bl-mini:disabled { opacity:.35; cursor:default; }
.bl-grp-h .bl-mini:hover:not(:disabled) {
  background:rgba(74,144,226,.18); color:#fff; border-color:#4a90e2;
}
.bl-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:3px; padding:4px 0;
}
.bl-item {
  padding:5px 0; text-align:center; border-radius:3px; cursor:pointer;
  font-size:12px; font-weight:600; color:#9fb3d1; letter-spacing:.3px;
  background:rgba(255,255,255,.04); border:1px solid rgba(120,160,220,.12);
  transition:.12s; user-select:none;
  text-decoration:none; display:block;
}
a.bl-item:hover { text-decoration:none; }
.bl-item:hover { background:rgba(74,144,226,.12); color:#cdd9ec; border-color:rgba(120,160,220,.25); }
.bl-item.active { background:rgba(74,144,226,.32); color:#fff; border-color:rgba(159,200,255,.4); }
.bl-count {
  margin-top:6px; font-size:12px; color:#9fb3d1;
  font-variant-numeric:tabular-nums; text-align:right;
}
.bl-count b { color:#cdd9ec; }
