/* MVG Mitgliederverwaltung – Gestaltung „Wappen und Schwarzwald“
   Tannengrün nur in der Seitenleiste, Wappengold für Aktiv-Zustände, ruhiger Inhalt auf Kalkweiß.
   Ungeschichtetes CSS: überschreibt Filaments @layer-Regeln gezielt über die fi-*-Klassen. */
:root {
  --mvg-tanne: #15332d;
  --mvg-tanne-2: #1d433b;
  --mvg-tanne-3: #275449;
  --mvg-gold: #b4955a;
  --mvg-gold-hell: #d8c49a;
  --mvg-gold-tief: #8a6f3c;
  --mvg-graphit: #1f2326;
  --mvg-kalk: #f2f3f1;
  --mvg-linie: #e2e4df;
  --mvg-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --mvg-radius: 10px;
}

/* ---------- Grundfläche ---------- */
html:not(.dark) .fi-body { background: var(--mvg-kalk); color: var(--mvg-graphit); }
.fi-body { -webkit-font-smoothing: antialiased; }
.fi-main { padding-top: .25rem; }

/* ---------- Seitenleiste: das eine kräftige Element ---------- */
.fi-sidebar,
.fi-sidebar.fi-sidebar-open { background: var(--mvg-tanne) !important; border-right: 0 !important; box-shadow: none; }
html.dark .fi-sidebar { background: #10282340 !important; background-color: #0f2520 !important; }
.fi-sidebar-header { background: transparent !important; border-bottom: 1px solid rgba(216,196,154,.16) !important; box-shadow: none !important; height: 5.25rem !important; }
.fi-sidebar-nav { padding-top: 1.25rem; }
.fi-sidebar-group-label { color: rgba(216,196,154,.78) !important; font-weight: 600; font-size: .78rem; letter-spacing: .01em; }
.fi-sidebar-group-btn svg, .fi-sidebar-group-collapse-btn svg { color: rgba(216,196,154,.6) !important; }
.fi-sidebar-item-btn { border-radius: 8px !important; }
.fi-sidebar-item-label { color: #e7ebe6 !important; font-weight: 500; }
.fi-sidebar-item-icon { color: rgba(231,235,230,.62) !important; }
.fi-sidebar-item-btn:hover, .fi-sidebar-item-btn:focus-visible { background: var(--mvg-tanne-2) !important; }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: var(--mvg-tanne-3) !important; box-shadow: inset 3px 0 0 var(--mvg-gold); }
.fi-sidebar-item.fi-active .fi-sidebar-item-label { color: #fff !important; font-weight: 600; }
.fi-sidebar-item.fi-active .fi-sidebar-item-icon { color: var(--mvg-gold-hell) !important; }
.fi-sidebar-item-grouped-border-part { background: rgba(216,196,154,.25) !important; }
.fi-sidebar-item-badge-ctn .fi-badge { background: rgba(216,196,154,.18) !important; color: var(--mvg-gold-hell) !important; box-shadow: none !important; }
.fi-sidebar-close-collapse-sidebar-btn svg, .fi-sidebar-open-collapse-sidebar-btn svg, .fi-sidebar-header .fi-icon-btn svg { color: rgba(231,235,230,.7) !important; }
.fi-sidebar-footer { border-top: 1px solid rgba(216,196,154,.16); }
.fi-sidebar ::-webkit-scrollbar { width: 6px; } .fi-sidebar ::-webkit-scrollbar-thumb { background: rgba(216,196,154,.25); border-radius: 3px; }

/* Logo: in der Seitenleiste helle Variante, sonst Originalfarben */
.mvg-brand { display: flex; align-items: center; }
.mvg-brand img { height: 3.4rem; width: auto; }
.mvg-brand .mvg-brand-dark { display: none; }
.fi-sidebar .mvg-brand .mvg-brand-light { display: none; }
.fi-sidebar .mvg-brand .mvg-brand-dark { display: block; }
html.dark .mvg-brand .mvg-brand-light { display: none; }
html.dark .mvg-brand .mvg-brand-dark { display: block; }
.fi-topbar .mvg-brand img { height: 2.9rem; }
.fi-simple-layout .fi-logo { height: auto !important; margin-bottom: 1.25rem; justify-content: center; }
.fi-simple-layout .mvg-brand img { height: 6rem; }
.fi-simple-header-heading { margin-top: .25rem; }

/* ---------- Kopfleiste: bildet mit der Seitenleiste einen durchgehenden Rahmen ---------- */
.fi-topbar-ctn, .fi-topbar { background: var(--mvg-tanne) !important; box-shadow: none !important; border-bottom: 1px solid rgba(216,196,154,.16) !important; }
html.dark .fi-topbar-ctn, html.dark .fi-topbar { background: #0f2520 !important; }
.fi-topbar .mvg-brand .mvg-brand-light { display: none; }
.fi-topbar .mvg-brand .mvg-brand-dark { display: block; }
.fi-topbar .fi-icon-btn svg { color: rgba(231,235,230,.75) !important; }
.fi-topbar .fi-icon-btn:hover { background: var(--mvg-tanne-2) !important; }
.fi-topbar .fi-input-wrp { background: rgba(255,255,255,.08) !important; border: 1px solid rgba(216,196,154,.22) !important; box-shadow: none !important; }
.fi-topbar .fi-input-wrp input { color: #eef0ec !important; }
.fi-topbar .fi-input-wrp input::placeholder { color: rgba(231,235,230,.6) !important; }
.fi-topbar .fi-input-wrp svg { color: rgba(231,235,230,.6) !important; }
.fi-topbar .fi-input-wrp:focus-within { border-color: var(--mvg-gold) !important; box-shadow: 0 0 0 3px rgba(180,149,90,.25) !important; }
.fi-topbar .fi-user-menu-trigger .fi-avatar, .fi-topbar .fi-avatar { box-shadow: 0 0 0 2px rgba(216,196,154,.55); }
.fi-topbar-item-label { color: #e7ebe6 !important; }

/* ---------- Typografie ---------- */
.fi-header-heading { font-family: var(--mvg-serif); font-weight: 600 !important; letter-spacing: -.012em; font-size: 1.85rem !important; line-height: 1.15 !important; }
.fi-header-subheading { max-width: 70ch; }
.fi-section-header-heading, .fi-ta-header-heading, .fi-modal-heading, .fi-simple-header-heading { font-family: var(--mvg-serif); font-weight: 600 !important; letter-spacing: -.005em; }
.fi-section-header-heading { font-size: 1.06rem !important; }
.fi-simple-header-heading { font-size: 1.6rem !important; }
.fi-wi-stats-overview-stat-value { font-family: var(--mvg-serif); font-weight: 600 !important; letter-spacing: -.01em; font-variant-numeric: lining-nums tabular-nums; }
.fi-ta-cell, .fi-in-entry, .fi-wi-stats-overview-stat-description { font-variant-numeric: tabular-nums; }
.fi-breadcrumbs-item-label { font-size: .82rem; }

/* ---------- Flächen: Rahmen statt Schatten, eine Rundung ---------- */
html:not(.dark) .fi-section,
html:not(.dark) .fi-ta-ctn,
html:not(.dark) .fi-wi-stats-overview-stat { background: #fff; box-shadow: none !important; border: 1px solid var(--mvg-linie) !important; border-radius: var(--mvg-radius) !important; --tw-ring-shadow: 0 0 #0000 !important; }
html:not(.dark) .fi-section-header { border-bottom-color: var(--mvg-linie); }
.fi-wi-stats-overview-stat { padding: 1.15rem 1.25rem !important; }

/* Tabellen: ruhige Köpfe, warme Hover-Zeile */
html:not(.dark) .fi-ta-header-cell { background: #f7f8f6; color: #4b5049; font-weight: 600; font-size: .82rem; }
html:not(.dark) .fi-ta-row:hover > td { background: #faf7f0 !important; }
html:not(.dark) .fi-ta-row td { border-color: #edefeb; }
.fi-ta-header-cell-sort-btn { font-weight: 600; }

/* Reiter */
html:not(.dark) .fi-tabs { box-shadow: none !important; border: 1px solid var(--mvg-linie); background: #fff; border-radius: var(--mvg-radius); }
.fi-tabs-item.fi-active { box-shadow: inset 0 -2px 0 var(--mvg-gold-tief); border-radius: 6px 6px 0 0; }

/* Eingabefelder */
html:not(.dark) .fi-input-wrp { box-shadow: none !important; border: 1px solid #d6d9d2; border-radius: 8px !important; background: #fff; }
html:not(.dark) .fi-input-wrp:focus-within { border-color: var(--mvg-gold-tief); box-shadow: 0 0 0 3px rgba(168,137,79,.18) !important; }
.fi-fo-field-label-content { font-weight: 600; color: #3a3f39; }
html.dark .fi-fo-field-label-content { color: #d9ddd6; }

/* Schaltflächen: Primär in dunklem Gold mit weißer Schrift (Kontrast AA) */
.fi-btn { border-radius: 8px !important; font-weight: 600 !important; }
html:not(.dark) .fi-btn.fi-color-primary[class*="fi-bg-color-"] { background-color: var(--mvg-gold-tief) !important; color: #fff !important; }
html:not(.dark) .fi-btn.fi-color-primary[class*="fi-bg-color-"]:hover { background-color: #6f5830 !important; }
html:not(.dark) .fi-btn.fi-color-primary[class*="fi-bg-color-"] .fi-icon, html:not(.dark) .fi-btn.fi-color-primary[class*="fi-bg-color-"] svg { color: #fff !important; }
.fi-btn:focus-visible, .fi-icon-btn:focus-visible, .fi-sidebar-item-btn:focus-visible { outline: 2px solid var(--mvg-gold); outline-offset: 2px; }

/* Plaketten etwas leiser */
.fi-badge { font-weight: 600 !important; }

/* ---------- Anmeldung ---------- */
html:not(.dark) .fi-simple-layout { background:
  radial-gradient(1200px 600px at 50% -10%, rgba(180,149,90,.10), transparent 60%), var(--mvg-kalk); }
html:not(.dark) .fi-simple-main { background: #fff; box-shadow: 0 1px 0 rgba(31,35,38,.04), 0 18px 40px -24px rgba(21,51,45,.35) !important; border: 1px solid var(--mvg-linie); border-radius: 14px !important; --tw-ring-shadow: 0 0 #0000 !important; }

/* ---------- Bildauswahl Restaurant ---------- */
.mvg-thumb { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 8px; border: 1px solid var(--mvg-linie); background: #eef0ec; }
.mvg-thumb-name { display: block; font-size: .72rem; color: #6b7068; margin-top: .25rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 14rem; }

/* ---------- Startseite: Aufgabenliste ---------- */
.mvg-todo { display: grid; gap: .5rem; }
.mvg-todo a { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .7rem .9rem; border-radius: 8px; text-decoration: none; color: inherit; border: 1px solid transparent; }
.mvg-todo a:hover { background: #faf7f0; border-color: #eadfc6; }
html.dark .mvg-todo a:hover { background: rgba(180,149,90,.08); border-color: rgba(180,149,90,.25); }
.mvg-todo-count { font-family: var(--mvg-serif); font-size: 1.35rem; font-weight: 600; font-variant-numeric: tabular-nums; min-width: 3ch; text-align: right; }
.mvg-todo-text { line-height: 1.35; }
.mvg-todo-text small { display: block; color: #6b7068; }
.mvg-todo-done { color: #6b7068; padding: .7rem .9rem; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }