/* Verwaltung — funktional, dieselbe Palette, dichter gesetzt. */

body.admin{background:var(--ground); font-size:15.5px}

.adminbar{
  position:sticky; top:0; z-index:50;
  background:var(--console); color:var(--on-dark);
  border-bottom:1px solid var(--line-dark);
}
.adminbar__in{
  max-width:1400px; margin-inline:auto; padding:12px var(--gutter);
  display:flex; align-items:center; gap:var(--s3); flex-wrap:wrap;
}
.adminbar .brand__mark{color:#F2EFE7; font-size:1.18rem}
.adminbar__tag{
  font-size:.62rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--bronze-2); border:1px solid var(--line-dark); border-radius:20px; padding:3px 10px;
}
.adminnav{display:flex; gap:var(--s3); list-style:none; margin-left:var(--s3); flex-wrap:wrap}
.adminnav a{
  font-size:.88rem; color:var(--on-dark-2); text-decoration:none;
  padding:6px 0; border-bottom:1px solid transparent;
}
.adminnav a:hover{color:#F2EFE7}
.adminnav a[aria-current="page"]{color:#F2EFE7; border-bottom-color:var(--bronze-2)}
.adminbar__right{margin-left:auto; display:flex; align-items:center; gap:var(--s3); font-size:.85rem; color:var(--on-dark-3)}
.adminbar__right a{color:var(--on-dark-2)}

.adminwrap{max-width:1400px; margin-inline:auto; padding:var(--s5) var(--gutter) var(--s6)}
.adminhead{display:flex; flex-wrap:wrap; gap:var(--s3); align-items:flex-end; margin-bottom:var(--s4)}
.adminhead h1{font-size:clamp(1.8rem,3vw,2.4rem)}
.adminhead__right{margin-left:auto; display:flex; gap:var(--s2); flex-wrap:wrap}

/* Kennzahlen */
.kpis{display:grid; gap:1px; background:var(--line-2); grid-template-columns:repeat(2,1fr); margin-bottom:var(--s5); border:1px solid var(--line-2)}
@media(min-width:900px){.kpis{grid-template-columns:repeat(4,1fr)}}
.kpi{background:var(--surface); padding:var(--s3)}
.kpi u{display:block; text-decoration:none; font-size:.66rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
/* Zahlen durchgehend in der Grotesk, mit gleicher Laufweite pro Ziffer. */
.kpi b{
  display:block; margin-top:8px;
  font-family:var(--display); font-size:1.9rem; font-weight:600;
  line-height:1; letter-spacing:-.025em; font-variant-numeric:tabular-nums lining-nums;
}
.admin table td,.admin table th{font-family:var(--sans); font-variant-numeric:tabular-nums lining-nums}
.admin table td b{font-family:var(--display); font-weight:600; letter-spacing:-.01em}
.kpi i{display:block; margin-top:5px; font-style:normal; font-size:.82rem; color:var(--muted); font-variant-numeric:tabular-nums}
.kpi--free b{color:var(--st-free)}
.kpi--res b{color:var(--st-res)}
.kpi--sold b{color:var(--st-sold)}

/* Balken */
.bar{display:flex; height:9px; border-radius:20px; overflow:hidden; background:var(--line-2); margin-top:var(--s2)}
.bar span{display:block}
.bar__free{background:var(--st-free)}
.bar__res{background:var(--st-res)}
.bar__sold{background:var(--st-sold)}
.barkey{display:flex; flex-wrap:wrap; gap:var(--s3); margin-top:var(--s2); font-size:.82rem; color:var(--muted)}
.barkey b{color:var(--ink); font-variant-numeric:tabular-nums}
.barkey i{display:inline-block; width:8px; height:8px; border-radius:2px; margin-right:6px}

.panel{background:var(--surface); border:1px solid var(--line-2); border-radius:var(--radius); margin-bottom:var(--s4)}
.panel__head{
  display:flex; flex-wrap:wrap; gap:var(--s2); align-items:center;
  padding:var(--s3); border-bottom:1px solid var(--line-2);
}
.panel__head h2{font-size:1.32rem}
.panel__head .btn{margin-left:auto}
.panel__body{padding:var(--s3)}
.panel table{min-width:0; background:transparent}
.panel table th, .panel table td{padding:10px 14px}

/* Bestandstabelle */
.grid{display:grid; gap:var(--s2); grid-template-columns:1fr}
@media(min-width:700px){.grid--3{grid-template-columns:repeat(3,1fr)}}
@media(min-width:900px){.grid--4{grid-template-columns:repeat(4,1fr)}}
@media(min-width:1100px){.grid--6{grid-template-columns:repeat(6,1fr)}}

.statusform{display:inline-flex; gap:6px; align-items:center}
.statusform select{
  padding:6px 26px 6px 9px; font-size:.82rem; border-radius:2px;
  border:1px solid var(--line); background:var(--ground); color:var(--ink);
  appearance:none; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:calc(100% - 14px) calc(50% + 1px), calc(100% - 10px) calc(50% + 1px);
  background-size:4px 4px,4px 4px; background-repeat:no-repeat;
}
/* Kein display:flex auf der Zelle — das nimmt sie aus dem Tabellenlayout
   heraus und die Links rutschen aus ihrer Zeile. */
.rowactions{text-align:right; white-space:nowrap}
.rowactions a{
  display:inline-block; font-size:.82rem; color:var(--bronze);
  text-decoration:none; white-space:nowrap;
}
.rowactions a + a{margin-left:var(--s2)}
.rowactions a:hover{text-decoration:underline}

.btn--danger{background:transparent; border-color:color-mix(in srgb, #9B3B2E 55%, transparent); color:#9B3B2E}
.btn--danger:hover{background:color-mix(in srgb, #9B3B2E 10%, transparent); filter:none}
:root[data-theme="dark"] .btn--danger{color:#E08373; border-color:color-mix(in srgb,#E08373 45%,transparent)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .btn--danger{color:#E08373; border-color:color-mix(in srgb,#E08373 45%,transparent)}}

/* Anmeldung */
.login{min-height:100dvh; display:grid; place-items:center; padding:var(--s4); background:var(--console)}
.login__box{
  width:100%; max-width:400px; background:var(--surface);
  border:1px solid var(--line-2); border-radius:var(--radius);
  padding:var(--s5) var(--s4); box-shadow:var(--shadow-lg);
}
.login__box h1{font-size:1.9rem; margin-bottom:var(--s1)}
.login__box .small{margin-bottom:var(--s4)}

/* Audit */
.log{list-style:none; font-size:.88rem}
.log li{display:grid; grid-template-columns:auto 1fr; gap:var(--s3); padding:9px 0; border-bottom:1px solid var(--line-2)}
.log li:last-child{border-bottom:0}
.log time{color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap}
.log b{font-weight:500}

/* Interessenten- und Angebotsdetail: Inhalt links, Randspalte rechts. */
.leadgrid{display:grid; gap:var(--s4); grid-template-columns:1fr}
@media(min-width:1080px){.leadgrid{grid-template-columns:minmax(0,1fr) 340px; align-items:start}}
.leadgrid > * > .panel:last-child{margin-bottom:0}

a.kpi{color:inherit; transition:background .2s ease}
a.kpi:hover{background:var(--sunk)}

.seedhint{
  background:var(--bronze-soft); border:1px solid color-mix(in srgb, var(--bronze) 34%, transparent);
  border-radius:var(--radius); padding:var(--s3); margin-bottom:var(--s4); font-size:.92rem;
}
.seedhint b{display:block; margin-bottom:4px}

/* Verlaufsdiagramm der Seitenaufrufe */
.verlauf{
  display:flex; align-items:flex-end; gap:2px;
  height:110px; padding:0; margin:0;
}
.verlauf__bar{
  flex:1 1 0; min-width:2px; background:var(--st-free);
  border-radius:1px 1px 0 0; opacity:.85;
}
.verlauf__bar:hover{opacity:1}

/* ── Sprachumschalter in der Kopfleiste ──
   Dieselbe Form in Verwaltung und Brokerfläche. Bewusst schlicht: ein Feld,
   das sich der dunklen Leiste unterordnet, statt eines Knopfes, der mit der
   Navigation um Aufmerksamkeit ringt. */
.sprachform{display:flex; align-items:center; margin:0}
.sprachform select{
  appearance:none; -webkit-appearance:none;
  background:transparent; border:1px solid var(--on-dark-line, rgba(255,255,255,.22));
  border-radius:6px; color:var(--on-dark-2); font:inherit; font-size:.85rem;
  padding:4px 24px 4px 9px; cursor:pointer; line-height:1.3;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23b9c2bd' stroke-width='1.4'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 8px center;
}
.sprachform select:hover{color:var(--on-dark); border-color:rgba(255,255,255,.4)}
.sprachform select:focus-visible{outline:2px solid var(--gold, #c9a063); outline-offset:2px}
/* Die Klappliste selbst zeichnet das System — dort gilt die helle Schrift
   nicht, sonst stünde Weiss auf Weiss. */
.sprachform option{color:#15201d; background:#fff}