/* ==========================================================================
   KCC – Immobilien-Angleichung (Paket IMMO-ANGLEICH, 21.10.2026)  –  Datei: /assets/css/kcc-re.css
   Goldene Immobilien-Leiste, Hinweis-Kasten, Admin-Karte "Immobilien im Funnel".  Gold wie Startseite/Funnel (#EBCB72 / #F9E596 / #B07F2A).
   Ansicht: PC, Tablet hoch/quer, Handy (ab 640 px schmal: Knopfreihe wischbar, Texte brechen um).
   ========================================================================== */
.kre-nav,.kre-nav *,.kre-note,.kre-note *,.kre-ctl,.kre-ctl *{box-sizing:border-box}
.kre-nav{width:100%;max-width:100%;margin:0 0 22px;border:1px solid rgba(233,197,106,.2);border-radius:18px;background:linear-gradient(180deg,rgba(28,23,15,.92),rgba(13,11,8,.94));box-shadow:0 12px 32px rgba(0,0,0,.35);color:#F3ECDD;font-family:inherit;position:relative;z-index:2}
.kre-nav-in{display:flex;flex-direction:column;gap:10px;padding:12px 14px}
.kre-row{display:flex;align-items:center;gap:12px;min-width:0}
.kre-ttl{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;color:#EBCB72;font-size:12px;font-weight:800;letter-spacing:.9px;text-transform:uppercase;white-space:nowrap}
.kre-row>.kre-ttl{align-self:flex-start;min-height:40px}
.kre-ttl i{font-size:15px}
.kre-items,.kre-vs{display:flex;flex-wrap:wrap;gap:8px;min-width:0;flex:1 1 auto}
.kre-i,.kre-v{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 15px;border-radius:999px;border:1px solid rgba(233,197,106,.28);background:rgba(0,0,0,.35);color:#D9CDB0;font-size:13px;font-weight:700;line-height:1;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s}
.kre-i i,.kre-v i{font-size:13px;color:#EBCB72;transition:color .2s}
.kre-i:hover,.kre-v:hover{border-color:#EBCB72;color:#EBCB72;transform:translateY(-1px)}
.kre-i.on{background:linear-gradient(135deg,#F9E596,#EBCB72 45%,#B07F2A);border-color:transparent;color:#1a1206;cursor:default}
.kre-i.on i{color:#1a1206}
.kre-i:focus-visible,.kre-v:focus-visible,.kre-btn:focus-visible{outline:2px solid #EBCB72;outline-offset:2px}
.kre-views{padding-top:10px;border-top:1px dashed rgba(233,197,106,.18)}
.kre-vl{flex:0 0 auto;color:#B6A98E;font-size:11px;font-weight:700;letter-spacing:.9px;text-transform:uppercase;white-space:nowrap}
.kre-v{min-height:34px;padding:0 13px;font-size:12px}
.kre-v.on{border-color:#EBCB72;background:rgba(235,203,114,.12);color:#EBCB72;cursor:default}
.kre-v.on:hover{transform:none}
/* Hinweis-Kasten (fehlende Tabellen) */
.kre-note{display:flex;align-items:center;gap:14px;flex-wrap:wrap;width:100%;max-width:100%;margin:0 0 22px;padding:14px 18px;border:1px solid rgba(233,197,106,.32);border-radius:14px;background:rgba(235,203,114,.07);color:#F3ECDD;font-size:.95rem;line-height:1.5;position:relative;z-index:2}
.kre-note>i{flex:0 0 auto;font-size:1.3rem;color:#EBCB72}
.kre-note-t{flex:1 1 220px;min-width:0;overflow-wrap:anywhere}
.kre-note-admin{border-color:rgba(255,107,107,.45);background:rgba(255,107,107,.07)}
.kre-note-admin>i{color:#ff8f8f}
/* Knoepfe */
.kre-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:999px;border:1px solid rgba(233,197,106,.45);background:linear-gradient(135deg,#F9E596,#EBCB72 45%,#B07F2A);color:#1a1206;font-family:inherit;font-size:13px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:filter .2s,transform .2s,box-shadow .2s}
.kre-btn:hover{filter:brightness(1.07);transform:translateY(-1px);box-shadow:0 8px 22px rgba(233,197,106,.28)}
.kre-btn[disabled]{opacity:.6;cursor:wait;transform:none}
.kre-btn-s{background:transparent;color:#EBCB72;min-height:40px;padding:0 16px;font-size:12px}
.kre-btn-s:hover{background:#EBCB72;color:#1a1206}
/* Admin-Karte */
.kre-ctl{width:100%;max-width:100%;margin:0 0 22px;padding:16px 18px;border:1px solid rgba(233,197,106,.2);border-radius:18px;background:linear-gradient(180deg,rgba(28,23,15,.92),rgba(13,11,8,.94));box-shadow:0 12px 32px rgba(0,0,0,.3);color:#F3ECDD;position:relative;z-index:2}
.kre-ctl-h{display:flex;align-items:center;gap:10px;margin:0 0 12px}
.kre-ctl-h i{color:#EBCB72;font-size:18px}
.kre-ctl-h h2{margin:0;font-size:1rem;font-weight:800;color:#F3ECDD;text-transform:uppercase;letter-spacing:.6px;line-height:1.3}
.kre-ctl-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));gap:10px;margin:0 0 12px}
.kre-ctl-c{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;padding:8px 14px;border:1px solid rgba(233,197,106,.16);border-radius:12px;background:rgba(0,0,0,.3)}
.kre-ctl-k{color:#B6A98E;font-size:12px;font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.kre-ctl-n{color:#EBCB72;font-size:1.4rem;font-weight:900;line-height:1}
.kre-pill{display:inline-flex;align-items:center;min-height:26px;padding:0 12px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}
.kre-pill.is-on{background:rgba(0,255,136,.12);border:1px solid rgba(0,255,136,.45);color:#00ff88}
.kre-pill.is-off{background:rgba(255,107,107,.1);border:1px solid rgba(255,107,107,.45);color:#ff8f8f}
.kre-ctl-p{margin:0 0 12px;color:#B6A98E;font-size:.9rem;line-height:1.6}
.kre-ctl-l{display:flex;flex-wrap:wrap;gap:8px}
/* Umhuellung fuer Seiten ohne eigenen Innenabstand (Exposé-Seiten): Abstand zur festen Kopfleiste wie auf den anderen Seiten */
.kre-wrap{max-width:1400px;margin:0 auto;padding:120px clamp(14px,3vw,40px) 0;box-sizing:border-box}
.kre-wrap .kre-nav,.kre-wrap .kre-note,.kre-wrap .kre-ctl{margin-bottom:18px}
/* Die alte Modul-Navigation der Mitglieder-Seiten bleibt im Code, wird aber ausgeblendet, sobald die neue Leiste davor steht (alle ihre Ziele stehen in der Leiste) */
.kre-nav ~ .re-subnav{display:none !important}
/* Tablet hoch und schmaler */
@media (max-width:900px){
  .kre-nav-in{padding:11px 12px}
}
/* Handy */
@media (max-width:640px){
  .kre-wrap{padding-top:96px}
  .kre-nav{margin-bottom:16px;border-radius:14px}
  .kre-row{flex-direction:column;align-items:stretch;gap:8px}
  .kre-row>.kre-ttl{min-height:0}
  .kre-items,.kre-vs{flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:2px 2px 4px;margin:0 -2px;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 26px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 26px),transparent)}
  .kre-items::-webkit-scrollbar,.kre-vs::-webkit-scrollbar{display:none}
  .kre-views{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px 10px}
  /* NEU 21.10.2026: Ansicht-Knoepfe am Handy umbrechen statt am Rand abgeschnitten zu werden (2 bis 4 kurze Knoepfe) */
  .kre-views .kre-vs{flex:1 1 100%;margin:0;padding:0;flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}
  .kre-note,.kre-ctl{border-radius:14px;padding:12px 14px;margin-bottom:16px}
  .kre-note .kre-btn{width:100%}
  .kre-ctl-l .kre-btn{flex:1 1 100%}
}
@media (pointer:coarse){ .kre-i{min-height:44px} .kre-v{min-height:40px} }
@media (prefers-reduced-motion:reduce){ .kre-i,.kre-v,.kre-btn{transition:none} .kre-i:hover,.kre-v:hover,.kre-btn:hover{transform:none} }
