/* =========================================================================
   remuju — Glass-Aurora-Theme  (in-place Redesign, Bootstrap 5.3 dark)
   Glassmorphismus: transluzente, geblurrte Panels über Aurora-Farbnebel.
   Token-getrieben → Fallbacks (reduzierte Transparenz / kein backdrop-filter)
   überschreiben nur Variablen. app.js bleibt unangetastet.
   ========================================================================= */
:root{
  --bg:        #070912;
  --surface:   rgba(255,255,255,.055);   /* Glas-Panel (über dunkler Basis = effektiv dunkel) */
  --surface-2: rgba(255,255,255,.085);
  --surface-3: rgba(255,255,255,.13);
  --input-bg:  rgba(8,11,22,.55);         /* Inputs etwas opaker für Tippbarkeit */
  --border:    rgba(255,255,255,.12);
  --border-2:  rgba(255,255,255,.20);
  --hairline:  rgba(255,255,255,.08);
  --text:      #f3f5fc;
  --text-2:    #c3c9da;
  --text-3:    #8a91a6;

  --ok:    #34d399;
  --warn:  #f5b455;
  --danger:#f2685f;

  --accent:        #7b7cff;
  --accent-2:      #22d3ee;
  --accent-soft:   rgba(123,124,255,.18);
  --accent-ring:   rgba(123,124,255,.5);
  --on-accent:     #0a0c1a;               /* dunkler Text auf hellem Akzent (WCAG ~6:1) */
  --brand-grad:    linear-gradient(135deg,#8f8cff 0%,#22d3ee 100%);

  --radius-card: 18px;
  --radius-input: 13px;
  --glass-blur:  saturate(160%) blur(16px);
  --glass-edge:  inset 0 1px 0 rgba(255,255,255,.12);
  --shadow-card: 0 20px 50px -22px rgba(0,0,0,.65);

  /* Rückwärtskompatibilität */
  --cb-primary: var(--accent); --cb-bg: var(--bg); --cb-sidebar: var(--surface);
  --cb-card: var(--surface); --cb-border: var(--border); --cb-text: var(--text); --cb-muted: var(--text-3);
}

/* ---- Bootstrap-Dark-Variablen remappen ---- */
[data-bs-theme="dark"]{
  --bs-body-bg: var(--bg);            --bs-body-bg-rgb: 7,9,18;
  --bs-body-color: var(--text);       --bs-body-color-rgb: 243,245,252;
  --bs-emphasis-color: #ffffff;       --bs-emphasis-color-rgb: 255,255,255;
  --bs-secondary-color: var(--text-2);
  --bs-tertiary-color: var(--text-3);
  --bs-border-color: var(--border);
  --bs-border-color-translucent: var(--hairline);
  --bs-primary: var(--accent);        --bs-primary-rgb: 123,124,255;
  --bs-primary-text-emphasis: #c4c4ff;
  --bs-link-color: #a9aaff;           --bs-link-color-rgb: 169,170,255;
  --bs-link-hover-color: #c4c4ff;
  --bs-heading-color: var(--text);
}

*{ -webkit-font-smoothing:antialiased; }
body{
  background:
    radial-gradient(620px 440px at 12% 6%,  rgba(123,124,255,.30), transparent 60%),
    radial-gradient(560px 440px at 90% 18%, rgba(34,211,238,.22),  transparent 60%),
    radial-gradient(680px 520px at 60% 108%, rgba(217,119,255,.18), transparent 60%),
    var(--bg);
  background-attachment: fixed;
  color: var(--text);
  font-family: 'Inter Tight', system-ui, -apple-system, 'Segoe UI', sans-serif;
  letter-spacing:-.01em; min-height:100vh;
}
h1,h2,h3,h4,h5,h6,.navbar-brand,.modal-title{ font-family:'Space Grotesk', sans-serif; letter-spacing:-.02em; }

/* ---- Glas-Mixin-Ersatz: alle größeren Flächen nutzen diese Tokens ---- */
.bg-dark{ background-color: var(--surface) !important; backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); box-shadow: var(--glass-edge); }
.border-secondary{ border-color: var(--border) !important; }
.text-secondary{ color: var(--text-2) !important; }
.text-light{ color: var(--text) !important; }
.text-primary{ color: var(--accent) !important; }
.border-primary-subtle{ border-color: rgba(123,124,255,.4) !important; }

/* ============================ BUTTONS ============================ */
.btn{ font-weight:600; border-radius:11px; }
.btn-primary{
  --bs-btn-bg:var(--accent); --bs-btn-border-color:var(--accent);
  --bs-btn-hover-bg:#8e8fff; --bs-btn-hover-border-color:#8e8fff;
  --bs-btn-active-bg:#6e6cf2; --bs-btn-active-border-color:#6e6cf2;
  --bs-btn-disabled-bg:var(--accent); --bs-btn-disabled-border-color:var(--accent);
  --bs-btn-color:var(--on-accent); --bs-btn-hover-color:var(--on-accent); --bs-btn-active-color:var(--on-accent);
  --bs-btn-disabled-color:var(--on-accent);
  box-shadow:0 8px 22px -10px var(--accent-ring);
}
.btn-outline-primary{
  --bs-btn-color:#b9baff; --bs-btn-border-color:rgba(123,124,255,.55);
  --bs-btn-hover-bg:var(--accent); --bs-btn-hover-border-color:var(--accent); --bs-btn-hover-color:var(--on-accent);
  --bs-btn-active-bg:var(--accent); --bs-btn-active-border-color:var(--accent); --bs-btn-active-color:var(--on-accent);
}
.btn-outline-secondary{
  --bs-btn-color:var(--text-2); --bs-btn-border-color:var(--border-2);
  --bs-btn-hover-bg:var(--surface-2); --bs-btn-hover-border-color:var(--border-2); --bs-btn-hover-color:var(--text);
  --bs-btn-active-bg:var(--surface-3); --bs-btn-active-color:var(--text);
}
.btn-outline-info{ --bs-btn-color:#8ee6f5; --bs-btn-border-color:rgba(34,211,238,.5); --bs-btn-hover-bg:rgba(34,211,238,.16); --bs-btn-hover-border-color:rgba(34,211,238,.6); --bs-btn-hover-color:#bdf1fa; }
.btn-outline-warning{ --bs-btn-color:var(--warn); --bs-btn-border-color:rgba(245,180,85,.5); --bs-btn-hover-bg:rgba(245,180,85,.14); --bs-btn-hover-border-color:rgba(245,180,85,.6); --bs-btn-hover-color:var(--warn); }
.btn-success{ --bs-btn-bg:var(--ok); --bs-btn-border-color:var(--ok); --bs-btn-hover-bg:#28bd86; --bs-btn-hover-border-color:#28bd86; --bs-btn-color:#06241a; --bs-btn-hover-color:#06241a; }
.btn-danger{ --bs-btn-bg:var(--danger); --bs-btn-border-color:var(--danger); --bs-btn-hover-bg:#e1554c; --bs-btn-hover-border-color:#e1554c; }

/* ============================ NAVBAR ============================ */
.navbar.bg-dark{ background-color: rgba(7,9,18,.55) !important; backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur); border-bottom:1px solid var(--hairline) !important; box-shadow:none; }
.navbar-brand{ font-weight:700; font-size:1.18rem; color:var(--text) !important; display:inline-flex; align-items:center; gap:.55rem; }
.brand-mark{ width:30px;height:30px;border-radius:10px; flex:0 0 auto; background:var(--brand-grad); display:inline-grid;place-items:center; color:#fff; font-size:.95rem; box-shadow:0 4px 16px -4px var(--accent-ring); }
.brand-mark.lg{ width:54px;height:54px;border-radius:16px;font-size:1.6rem; box-shadow:0 10px 28px -8px var(--accent-ring); }
#statusDot.bg-success{ background:rgba(52,211,153,.16) !important; color:#7fe7c0 !important; border:1px solid rgba(52,211,153,.3); font-family:'JetBrains Mono',monospace; font-weight:500; backdrop-filter:none; box-shadow:none; }

/* ============================ SIDEBAR ============================ */
.sidebar{
  background: rgba(255,255,255,.04); backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
  min-height: calc(100vh - 66px); border-right: 1px solid var(--hairline);
  position: sticky; top: 66px; height: calc(100vh - 66px); overflow-y: auto;
}
.sidebar .nav-link{ color: var(--text-2); border-radius:11px; transition:background .14s,color .14s; font-size:.9rem; font-weight:500; padding:.56rem .7rem; position:relative; display:flex; align-items:center; }
.sidebar .nav-link i{ opacity:.85; }
.sidebar .nav-link:hover{ color:var(--text); background:var(--surface-2); }
.sidebar .nav-link.active{ color:var(--text); background:var(--accent-soft); }
.sidebar .nav-link.active i{ color:var(--accent); opacity:1; }
.sidebar .nav-link.active::before{ content:""; position:absolute; left:-.5rem; top:50%; transform:translateY(-50%); width:3px;height:20px;border-radius:0 3px 3px 0; background:var(--accent); }

/* ============================ KARTEN / GLAS-PANELS ============================ */
.glass, .card, .modal-content, .vault-card, .persona-card, .search-result, .council-synthesis, .capture, .stat-card{
  backdrop-filter: var(--glass-blur); -webkit-backdrop-filter: var(--glass-blur);
}
.card{ --bs-card-bg:var(--surface); --bs-card-border-color:var(--border); border-radius:var(--radius-card); box-shadow:var(--glass-edge); }
.modal-content{ border-radius:22px; box-shadow:0 30px 70px -24px rgba(0,0,0,.75), var(--glass-edge); }

/* Inputs: opaker + Akzentring (kein Blur nötig) */
.form-control, .form-select{ background-color: var(--input-bg) !important; border-radius:12px; backdrop-filter:none; box-shadow:none; }
.form-control:focus, .form-select:focus{ background-color: var(--input-bg) !important; border-color:var(--accent); box-shadow:0 0 0 .2rem var(--accent-ring); }
.input-group-text{ border-radius:12px; }
.form-check-input:checked{ background-color:var(--accent); border-color:var(--accent); }
.form-check-input:focus{ border-color:var(--accent); box-shadow:0 0 0 .2rem var(--accent-ring); }

/* Aufnahme-Karte */
.capture{
  position:relative; overflow:hidden;
  background: radial-gradient(440px 200px at 100% 0%, var(--accent-soft), transparent 70%), var(--surface) !important;
  border:1px solid var(--border) !important; border-radius:var(--radius-card); box-shadow:var(--glass-edge);
}

/* ============================ VAULT CARDS ============================ */
.vault-card{ background: var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--glass-edge); transition: border-color .15s, transform .12s, box-shadow .15s; cursor: pointer; }
.vault-card:hover{ border-color:var(--border-2); transform:translateY(-2px); box-shadow:var(--shadow-card), var(--glass-edge); }
.vault-card .type-badge{ font-size:.7rem; font-weight:500; border-radius:999px; }
.vault-card .type-badge.bg-secondary{ background:var(--surface-2) !important; color:var(--text-2) !important; border:1px solid var(--border); backdrop-filter:none; }
.vault-card .card-title{ font-size:.96rem; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vault-card .card-text{ font-size:.84rem; color:var(--text-2); line-height:1.55; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* Tag-Pills (kein Blur) */
.tag-pill{ font-size:.72rem; padding:.12rem .55rem; border-radius:999px; background:var(--surface-2); border:1px solid var(--border); color:var(--text-2); cursor:pointer; transition:all .14s; display:inline-block; backdrop-filter:none; }
.tag-pill:hover{ background:var(--accent); border-color:var(--accent); color:var(--on-accent); }

/* Generische Listenzeile */
.search-result{ background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:var(--glass-edge); padding:.85rem 1rem; margin-bottom:.6rem; transition:border-color .15s, transform .12s; }
.search-result[onclick]:hover{ border-color:var(--border-2); transform:translateY(-1px); }
.search-result .score-bar{ height:4px; border-radius:2px; background:linear-gradient(90deg, var(--accent), var(--accent-2)); margin-top:.5rem; }

/* Status-Kacheln */
.stat-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-card); box-shadow:var(--glass-edge); padding:18px; text-align:center; }
.stat-card .stat-value{ font-family:'Space Grotesk',sans-serif; font-size:1.9rem; font-weight:600; color:#b9baff; letter-spacing:-.02em; }
.stat-card .stat-label{ font-size:.74rem; color:var(--text-3); text-transform:uppercase; letter-spacing:.06em; }

.core-indicator{ font-size:.7rem; color:var(--warn); }
.type-idea{ color:#b6a7fc } .type-snippet{ color:#b6a7fc } .type-link{ color:#74b6ff }
.type-document{ color:#4fe0b0 } .type-social{ color:#f78fc6 } .type-audio{ color:#fcaa6b }
.type-meeting{ color:#5ccff5 } .type-image{ color:#b6ec5e }

/* ============================ COUNCIL ============================ */
.council-synthesis{ background: linear-gradient(180deg, var(--accent-soft), transparent 70%), var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:var(--radius-card); box-shadow:var(--glass-edge); }
.council-text{ font-size:.92rem; line-height:1.75; color:var(--text); white-space:pre-wrap; }
.persona-card{ background:var(--surface); border:1px solid var(--border); border-radius:14px; box-shadow:var(--glass-edge); margin-bottom:.5rem; overflow:hidden; }
.persona-card .accordion-button{ background:transparent; color:var(--text); border:none; padding:.8rem 1rem; font-weight:500; }
.persona-card .accordion-button:not(.collapsed){ background:var(--surface-2); color:var(--text); box-shadow:none; }
.persona-card .accordion-button:focus{ box-shadow:0 0 0 .2rem var(--accent-ring); }
.persona-card .accordion-button::after{ filter:invert(1) opacity(.7); }
.persona-card .accordion-body{ background:transparent; padding:.85rem 1rem; font-size:.875rem; line-height:1.65; white-space:pre-wrap; color:var(--text-2); border-top:1px solid var(--hairline); }
.cost-badge{ font-family:'JetBrains Mono',monospace; font-size:.7rem; padding:.18rem .5rem; border-radius:999px; background:rgba(52,211,153,.14); color:#7fe7c0; border:1px solid rgba(52,211,153,.25); backdrop-filter:none; }

/* ============================ MISC ============================ */
.accordion{ --bs-accordion-bg:transparent; --bs-accordion-border-color:var(--border); --bs-accordion-active-bg:var(--surface-2); --bs-accordion-active-color:var(--text); --bs-accordion-btn-focus-box-shadow:0 0 0 .2rem var(--accent-ring); }
.table{ --bs-table-bg:transparent; --bs-table-color:var(--text); --bs-table-border-color:var(--border); }
.alert-danger{ --bs-alert-bg:rgba(242,104,95,.14); --bs-alert-border-color:rgba(242,104,95,.32); --bs-alert-color:#f8aaa4; }
.alert-success{ --bs-alert-bg:rgba(52,211,153,.14); --bs-alert-border-color:rgba(52,211,153,.32); --bs-alert-color:#8fe8c6; }
.spinner-border.text-primary{ color:var(--accent) !important; }
.progress{ background:var(--surface-2); border-radius:999px; }
.progress-bar.bg-primary{ background:var(--accent) !important; }
.dropdown-menu, .list-group{ --bs-dropdown-bg:rgba(20,24,38,.85); }

::selection{ background:var(--accent-soft); }
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:var(--border-2); border-radius:4px; }
::-webkit-scrollbar-thumb:hover{ background:rgba(255,255,255,.3); }

.blink{ animation:cb-blink 1s steps(2,start) infinite; }
@keyframes cb-blink{ to{ visibility:hidden; } }

@media (max-width: 767.98px){
  .sidebar{ position:static; height:auto; min-height:0; border-right:none; border-bottom:1px solid var(--border); }
}

/* ============================ FALLBACKS (Pflicht) ============================
   Ohne backdrop-filter-Support ODER bei reduzierter Transparenz: solide,
   dunkle Flächen statt durchscheinend (kein kaputtes Glas, weiter lesbar). */
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))){
  :root{
    --surface:#141826; --surface-2:#1a1f30; --surface-3:#222840; --input-bg:#10131f;
    --border:#2a3146; --border-2:#37405a; --hairline:rgba(255,255,255,.07); --glass-blur:none;
  }
}
@media (prefers-reduced-transparency: reduce){
  :root{
    --surface:#141826; --surface-2:#1a1f30; --surface-3:#222840; --input-bg:#10131f;
    --border:#2a3146; --border-2:#37405a; --hairline:rgba(255,255,255,.07); --glass-blur:none;
  }
  body{ background: radial-gradient(900px 520px at 88% -10%, var(--accent-soft), transparent 60%), var(--bg); }
}