/* atlas-workspace.css — geteilte Styles fuer Workspace-Panel in
 * de_1km.html, plz_export.html, compare.html. Wird via STATIC_ROOT
 * serviert (lokal) oder via nginx (Production). */

.ws-panel { position:fixed; top:64px; left:12px; bottom:36px; width:340px; max-width:42vw;
  background:#141d33; color:#cdd9ec; border-radius:9px; border:1px solid rgba(74,144,226,.32);
  box-shadow:0 8px 32px rgba(0,0,0,.5); z-index:500; display:flex; flex-direction:column;
  font-size:12px; animation:ws-slide-in-l .2s ease; font-family:-apple-system,BlinkMacSystemFont,sans-serif; }
.ws-panel[hidden] { display:none; }
@keyframes ws-slide-in-l { from{transform:translateX(-20px); opacity:0} to{transform:translateX(0); opacity:1} }
.ws-h { display:flex; justify-content:space-between; align-items:flex-start; padding:13px 14px 11px;
  border-bottom:1px solid rgba(255,255,255,.08); gap:10px; flex-shrink:0; }
.ws-title { font-size:13px; font-weight:700; color:#fff; }
.ws-sub { font-size:12px; color:#9fb3d1; margin-top:3px; line-height:1.5; }
.ws-h-actions { display:flex; align-items:center; gap:2px; }
.ws-x { background:transparent; color:#9fb3d1; border:0; font-size:22px; cursor:pointer; padding:0 4px; line-height:1; }
.ws-x:hover { color:#fff; }

/* Suche im Body (ab 8 Items oder bei aktiver Suche) */
.ws-search { position:sticky; top:-1px; z-index:5; background:rgba(15,22,35,.96);
  padding:6px 0 8px; margin:0 0 8px; border-bottom:1px solid rgba(255,255,255,.06);
  display:flex; align-items:center; gap:8px; }
.ws-search input { flex:1; padding:7px 10px; background:#0b1220; color:#cdd9ec;
  border:1px solid rgba(120,160,220,.25); border-radius:4px; font-family:inherit;
  font-size:12px; }
.ws-search input:focus { outline:none; border-color:#4a90e2; }
.ws-search-info { font-size:12px; color:#9fb3d1; white-space:nowrap;
  font-variant-numeric:tabular-nums; }

/* Karten-Gruppen im Modal-Body */
.ws-group { margin-bottom:12px; }
.ws-group-h { display:flex; align-items:center; gap:7px; padding:6px 4px 4px;
  font-size:12px; color:#9fb3d1; font-weight:700; text-transform:uppercase;
  letter-spacing:.4px; border-bottom:1px solid rgba(255,255,255,.05); }
.ws-group-h .ws-group-icon { font-size:13px; }
.ws-group-h .ws-group-lbl { flex:1; }
.ws-group-h .ws-group-count { color:#7d8aa2; font-weight:500;
  font-size:12px; text-transform:none; letter-spacing:0;
  font-variant-numeric:tabular-nums; }
.ws-group-items { padding-top:6px; }

/* Items-Liste (eingeloggt) */
.ws-body { padding:8px 12px 14px; overflow-y:auto; flex:1; }

/* Save-Section: Karten-Save-Buttons jetzt prominent oben im Modal (vorher in Toolbar) */
.ws-save-section { margin:6px 0 12px; padding:10px 12px; background:rgba(74,144,226,.10);
  border:1px solid rgba(120,160,220,.28); border-radius:6px; }
.ws-save-h { font-size:12px; color:#9fc8ff; font-weight:700; margin-bottom:8px;
  text-transform:uppercase; letter-spacing:.4px; }
.ws-save-row { display:flex; gap:6px; flex-wrap:wrap; }
.ws-save-btn { flex:1; min-width:120px; padding:8px 10px; background:rgba(74,144,226,.22);
  color:#cdd9ec; border:1px solid rgba(120,160,220,.4); border-radius:5px; cursor:pointer;
  font-family:inherit; font-size:12px; font-weight:600; text-align:center;
  transition:background .12s, color .12s; }
.ws-save-btn:hover { background:rgba(74,144,226,.36); color:#fff; }
.ws-save-btn.disabled { background:rgba(120,130,145,.12); color:#7d8aa2; cursor:not-allowed;
  border-color:rgba(120,130,145,.25); }
.ws-save-btn.disabled:hover { background:rgba(120,130,145,.12); color:#7d8aa2; }
.ws-save-lbl { display:inline; }

.ws-quota { font-size:12px; color:#9fb3d1; padding:4px 0 8px; text-align:right;
  font-variant-numeric:tabular-nums; }
.ws-quota b { color:#cdd9ec; }
.ws-quota.full b { color:#ffc080; }
.ws-quota-by-type { display:flex; flex-wrap:wrap; gap:4px 8px; justify-content:flex-end;
  margin-top:4px; font-size:12px; }
.ws-quota-by-type .ws-qb { color:#9fb3d1; white-space:nowrap; }
.ws-quota-by-type .ws-qb b { color:#cdd9ec; font-weight:600; }
.ws-quota-by-type .ws-qb.full { color:#ffc080; }
.ws-quota-by-type .ws-qb.full b { color:#ffc080; }
.ws-empty { color:#9fb3d1; font-size:12px; padding:14px 8px; text-align:center; line-height:1.5; }
.ws-item { padding:9px 11px; border:1px solid rgba(255,255,255,.06); border-radius:5px;
  margin-bottom:6px; background:rgba(255,255,255,.02); transition:background .12s, border-color .12s; }
.ws-item:hover { background:rgba(74,144,226,.08); border-color:rgba(120,160,220,.25); }
.ws-item.ws-highlight { animation: ws-flash 1.4s ease-out; }
@keyframes ws-flash {
  0%, 30% { background: rgba(255,220,80,.32); border-color: #ffdc50;
            box-shadow: 0 0 12px rgba(255,220,80,.55); }
  100%    { background: rgba(255,255,255,.02); border-color: rgba(255,255,255,.06);
            box-shadow: none; }
}
.ws-item-h { display:flex; justify-content:space-between; align-items:flex-start; gap:6px; margin-bottom:3px; }
.ws-item-label { font-size:12px; font-weight:600; color:#fff; cursor:pointer; flex:1;
  word-break:break-word; }
.ws-item-label:hover { color:#9fc8ff; text-decoration:underline; }
.ws-item-x { background:transparent; color:#9fb3d1; border:0; font-size:14px; cursor:pointer;
  padding:0 4px; line-height:1; flex-shrink:0; }
.ws-item-x:hover { color:#ff9c9c; }
.ws-item-meta { font-size:12px; color:#9fb3d1; line-height:1.4; }
.ws-item-note { font-size:12px; color:#cdd9ec; margin-top:4px; font-style:italic; opacity:.85; }

/* Login-Form (guest) */
.ws-login { padding:14px; flex:1; overflow-y:auto; }
.ws-login[hidden] { display:none; }
.ws-login-h { font-size:13px; font-weight:700; color:#9fc8ff; margin-bottom:8px; }
.ws-login-sub { font-size:12px; color:#cdd9ec; line-height:1.55; margin-bottom:14px; }
.ws-login form { display:flex; flex-direction:column; gap:10px; }
.ws-field { display:flex; flex-direction:column; gap:3px; }
.ws-field > span { font-size:12px; color:#9fb3d1; font-weight:600;
  letter-spacing:.2px; text-transform:uppercase; }
.ws-field .ws-opt { color:#6b7d99; font-weight:400; font-size:12px;
  text-transform:none; letter-spacing:0; margin-left:4px; }
.ws-login input, .ws-login textarea { padding:9px 10px; background:#0c1322;
  border:1px solid rgba(74,144,226,.25); border-radius:5px; color:#fff;
  font-size:12px; font-family:inherit; resize:vertical; }
.ws-login input:focus, .ws-login textarea:focus { outline:none; border-color:#9fc8ff;
  box-shadow:0 0 0 2px rgba(159,200,255,.18); }
.ws-login textarea { min-height:64px; line-height:1.45; }
.ws-extra-fields { display:flex; flex-direction:column; gap:10px;
  padding-top:6px; border-top:1px dashed rgba(120,160,220,.18); }
.ws-login form.returning .ws-extra-fields { display:none; }
.ws-login button[type="submit"] { padding:10px 12px; background:#4a90e2; color:#fff;
  font-weight:600; border:0; border-radius:5px; font-size:12.5px; cursor:pointer;
  font-family:inherit; margin-top:4px; }
.ws-login button[type="submit"]:hover { background:#5fa3ee; }
.ws-login button[type="submit"]:disabled { opacity:.5; cursor:wait; }
.ws-login-toggle { display:block; text-align:center; padding:6px 4px;
  font-size:12px; color:#9fb3d1; text-decoration:none; margin-top:2px; }
.ws-login-toggle:hover { color:#9fc8ff; text-decoration:underline; }
.ws-login-result { margin-top:12px; padding:10px 12px; border-radius:5px;
  font-size:12px; line-height:1.55; }
.ws-login-result.ok { background:rgba(80,200,120,.12); color:#7fdb9c;
  border:1px solid rgba(80,200,120,.32); }
.ws-login-result.err { background:rgba(217,107,107,.12); color:#ff9c9c;
  border:1px solid rgba(217,107,107,.32); }
.ws-login-result[hidden] { display:none; }

/* Pin-Sichtbarkeit (Tools mit Karten-Markern: derzeit nur de_1km) */
.ws-pin-master { background:transparent; color:#5b6b85; border:1px solid rgba(120,160,220,.3);
  font-size:13px; cursor:pointer; padding:3px 7px; border-radius:4px; line-height:1;
  font-family:inherit; transition:.12s; }
.ws-pin-master:hover { background:rgba(74,144,226,.18); color:#cdd9ec; border-color:#4a90e2; }
.ws-pin-master.active { background:rgba(255,220,80,.18); color:#ffdc50; border-color:rgba(255,220,80,.55); }
.ws-pin-toggle { background:transparent; color:#5b6b85; border:0; font-size:13px; cursor:pointer;
  padding:0 5px; line-height:1; flex-shrink:0; transition:color .12s; }
.ws-pin-toggle:hover { color:#cdd9ec; }
.ws-pin-toggle.active { color:#ffdc50; }
.ws-item.pin-hidden { opacity:.55; }
.ws-item.pin-hidden .ws-item-label { color:#9fb3d1; }