/* Zentrale Benutzerverwaltung – Look wie Volunteer/Fahrzeug/Material:
   blauer Verlauf, weisse Schrift, weisse Tabellen, gleich hohe Felder. */
.zbv-wrap, .zbv-wrap *, .zbv-wrap *::before, .zbv-wrap *::after { box-sizing: border-box; }
.zbv-wrap {
    --zbv-h: 40px; --zbv-line: var(--zp-line, rgba(255,255,255,.25)); --zbv-soft: var(--zp-soft, rgba(255,255,255,.07));
    background: var(--zp-bg, linear-gradient(135deg, rgb(34, 80, 227) 0%, rgb(0, 25, 61) 100%));
    color: var(--zp-text, #fff); padding: 28px 32px; border-radius: 10px; box-shadow: 0 6px 24px rgba(0,0,0,.25);
    font-size: 15px; line-height: 1.45; max-width: 100%;
}
/* Innerhalb eines Plugins, das selbst schon blau ist: kein zweiter Hintergrund */
:where(.vm-wrap, .fm-wrap, .mv-wrap, .vipm-wrap, .mv-app) .zbv-wrap { background: none; padding: 0; box-shadow: none; border-radius: 0; }
.zbv-wrap h2, .zbv-wrap h3, .zbv-wrap p, .zbv-wrap label, .zbv-wrap legend { color: var(--zp-text, #fff); }
.zbv-wrap h2 { margin: 0 0 12px; }
.zbv-wrap h3 { margin: 0 0 12px; font-size: 1.15rem; }
.zbv-wrap a { color: var(--zp-link, #e7ecff); }

.zbv-box { max-width: 420px; margin: 8px auto; padding: 22px 26px; border: 1px solid var(--zbv-line); border-radius: 8px; background: var(--zbv-soft); }
.zbv-box-wide { max-width: none; margin: 16px 0; }
.zbv-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 18px; align-items: start; }
.zbv-cols .zbv-box { margin: 0; max-width: none; }

.zbv-field { margin: 0 0 14px; display: flex; flex-direction: column; gap: 5px; }
.zbv-field label { font-weight: 600; font-size: .9rem; margin: 0; }
.zbv-wrap input[type=text], .zbv-wrap input[type=email], .zbv-wrap input[type=password],
.zbv-wrap input[type=url], .zbv-wrap input[type=search], .zbv-wrap select {
    height: var(--zbv-h) !important; padding: 0 10px !important; margin: 0 !important; width: 100%;
    border: 1px solid #ccc !important; border-radius: 4px !important; background: #fff !important; color: #222 !important;
    font-size: 15px !important; line-height: normal !important; box-shadow: none !important;
}
.zbv-wrap input[type=checkbox] { width: 18px; height: 18px; margin: 0; accent-color: #2271b1; vertical-align: middle; }

.zbv-btn { display: inline-flex; align-items: center; justify-content: center; height: var(--zbv-h, 40px); padding: 0 18px; margin: 0;
    background: #2271b1; color: #fff !important; border: 1px solid #2271b1; border-radius: 4px; cursor: pointer; font-size: 15px; line-height: 1; text-decoration: none !important; white-space: nowrap; }
.zbv-btn:hover { background: #135e96; border-color: #135e96; }
.zbv-btn-light { background: var(--zp-soft, rgba(255,255,255,.1)); border-color: var(--zp-line, rgba(255,255,255,.45)); }
.zbv-btn-light:hover { background: var(--zp-soft, rgba(255,255,255,.2)); }
.zbv-btn-danger { background: #c62828; border-color: #c62828; }
.zbv-small { font-size: .86em; color: var(--zp-link, #d7e0ff); }
.zbv-muted { opacity: .55; }
.zbv-msg { padding: 10px 14px; border-radius: 4px; margin: 0 0 14px; }
.zbv-msg-success { background: #d4edda; color: #155724; }
.zbv-msg-error { background: #f8d7da; color: #721c24; }

.zbv-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 10px; }
.zbv-head h2 { margin: 0; }
.zbv-account-links { display: inline-flex; flex-wrap: wrap; gap: 4px 14px; font-size: .9rem; align-items: baseline; }
.zbv-whoami { opacity: .8; }
.zbv-tabs { display: flex; flex-wrap: wrap; gap: 4px; border-bottom: 2px solid #ddd; margin: 16px 0 20px; }
.zbv-tab { padding: 8px 14px; text-decoration: none !important; border: 1px solid transparent; border-bottom: none; border-radius: 4px 4px 0 0; color: var(--zp-link, #e7ecff) !important; }
.zbv-tab:hover { background: var(--zp-soft, rgba(255,255,255,.15)); }
.zbv-tab-active { background: #fff; color: #17335c !important; border-color: #ddd; font-weight: 600; position: relative; top: 2px; }

.zbv-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.zbv-filter { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.zbv-filter input[type=search] { width: 240px !important; }
.zbv-filter select { width: auto !important; min-width: 180px; }

.zbv-table-wrap { overflow-x: auto; }
.zbv-table { width: 100%; border-collapse: collapse; background: #fff; color: #222; font-size: .92rem; }
.zbv-table th, .zbv-table td { padding: 7px 9px; border: 1px solid #ddd; text-align: left; vertical-align: top; color: #222; }
.zbv-table th { background: #f5f5f5; white-space: nowrap; }
.zbv-table tr:nth-child(even) td { background: #fafafa; }
.zbv-table a { color: #2271b1; }
.zbv-table .zbv-muted { color: #888; opacity: 1; }
.zbv-rights-cell { max-width: 220px; }
.zbv-inactive td { opacity: .5; }
.zbv-badge { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: .8em; font-weight: 600; white-space: nowrap; }
.zbv-badge-super { background: #6a1b9a; color: #fff; }
.zbv-badge-warn { background: #f59f00; color: #111; }

.zbv-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 0 18px; align-items: end; }
.zbv-checks label { display: flex; align-items: center; gap: 8px; margin: 6px 0; }
.zbv-modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 14px; margin-bottom: 16px; }
.zbv-module { min-width: 0; border: 1px solid var(--zbv-line); border-radius: 8px; padding: 12px 16px; margin: 0; background: var(--zbv-soft); }
.zbv-module legend { font-weight: 700; padding: 0 6px; }
.zbv-module .zbv-small { overflow-wrap: anywhere; }
.zbv-right { display: flex; align-items: flex-start; gap: 8px; margin: 6px 0; }
.zbv-right input { margin-top: 2px !important; }
.zbv-dim .zbv-module { opacity: .45; }
.zbv-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.zbv-log { max-height: 340px; overflow: auto; font-family: monospace; font-size: 12px; }
.zbv-rights-list { margin: 0; padding-left: 18px; }

/* Notfallseite im WP-Admin: helles WordPress-Design beibehalten */
.wp-admin .zbv-wrap.zbv-admin { background: none; color: inherit; padding: 0; box-shadow: none; }
.wp-admin .zbv-admin h2, .wp-admin .zbv-admin h3, .wp-admin .zbv-admin p, .wp-admin .zbv-admin label, .wp-admin .zbv-admin legend { color: #1d2327; }
.wp-admin .zbv-admin a { color: #2271b1; }
.wp-admin .zbv-admin .zbv-box, .wp-admin .zbv-admin .zbv-module { background: #fff; border-color: #c3c4c7; }
.wp-admin .zbv-admin .zbv-small { color: #50575e; }
.wp-admin .zbv-admin .zbv-btn-light { color: #2271b1 !important; border-color: #2271b1; background: #fff; }
@media (max-width: 600px) { .zbv-wrap { padding: 18px 14px; } .zbv-box { padding: 18px 16px; } }

/* Startseite [anwendungen] */
.zbv-start .zbv-head { margin-bottom: 20px; }
.zbv-apps { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 14px; }
.zbv-app { display: flex; flex-direction: column; border: 1px solid var(--zbv-line); border-radius: 10px; background: var(--zbv-soft); overflow: hidden; transition: background .15s, border-color .15s, transform .15s; }
.zbv-app:hover { background: var(--zp-soft, rgba(255,255,255,.14)); border-color: var(--zp-line, rgba(255,255,255,.5)); transform: translateY(-1px); }
.zbv-wrap a.zbv-app-main { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; color: var(--zp-text, #fff); text-decoration: none; flex: 1; }
.zbv-app-main:focus-visible { outline: 2px solid #fff; outline-offset: -4px; border-radius: 10px; }
.zbv-app-icon { flex: none; margin-top: 2px; opacity: .95; }
.zbv-app-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.zbv-app-text strong { font-size: 1.08rem; }
.zbv-app-text span { font-size: .88rem; color: var(--zp-link, #d7e0ff); }
.zbv-app-links { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 18px 14px 60px; }
.zbv-wrap .zbv-app-links a { font-size: .85rem; padding: 3px 10px; border: 1px solid var(--zp-line, rgba(255,255,255,.45)); border-radius: 14px; text-decoration: none; color: var(--zp-text, #fff); }
.zbv-wrap .zbv-app-links a:hover { background: var(--zp-soft, rgba(255,255,255,.2)); }
.zbv-apps-quick .zbv-app { background: var(--zp-soft, rgba(255,255,255,.12)); border-color: var(--zp-line, rgba(255,255,255,.4)); }
.zbv-apps-quick .zbv-app:hover { background: var(--zp-soft, rgba(255,255,255,.2)); }
.zbv-apps-sep { border: 0; border-top: 1px solid var(--zp-line, rgba(255,255,255,.35)); margin: 24px 0; height: 0; background: none; }

/* ------------------------------------------------------------------
   Kopfgrafik (ab 1.3.0, ab 1.4.0 einstellbar unter Organisation): Grafik rechts neben dem Titel jeder
   Anwendung, darunter eine feine Linie. Nur auf grösseren Bildschirmen –
   auf dem Handy (bis 700 px) erscheint sie nicht.
   ------------------------------------------------------------------ */
@media (min-width: 701px) {
    /* Kopfzeilen mit Titel + Konto-Links: Titel und Links links, Grafik rechts */
    body.zbv-kopf:not(.wp-admin) :is(.zbv-wrap > .zbv-head, .vm-fe-header, .fm-fe-header, .mv-head):not(.mv-app *, .zbv-standalone *) {
        display: grid !important; grid-template-columns: minmax(0, 1fr) auto; column-gap: 28px; row-gap: 0;
        align-items: end; padding-bottom: 14px; margin-bottom: 18px; border-bottom: 1px solid var(--zp-line, rgba(255,255,255,.25));
    }
    body.zbv-kopf:not(.wp-admin) :is(.zbv-wrap > .zbv-head, .vm-fe-header, .fm-fe-header, .mv-head):not(.mv-app *, .zbv-standalone *) > * {
        grid-column: 1; justify-self: start; margin-top: 6px;
    }
    body.zbv-kopf:not(.wp-admin) :is(.zbv-wrap > .zbv-head, .vm-fe-header, .fm-fe-header, .mv-head):not(.mv-app *, .zbv-standalone *) > :first-child { margin-top: 0; }

    /* Kopfzeilen nur mit Titel (PMZ-Finanzen, Check-in) */
    body.zbv-kopf:not(.wp-admin) :is(.be-wrap > .be-title, .vipm-scan > h2) {
        display: flex !important; align-items: flex-end; justify-content: space-between; gap: 28px;
        padding-bottom: 14px; border-bottom: 1px solid var(--zp-line, rgba(255,255,255,.25));
    }

    /* Die Grafik selbst */
    body.zbv-kopf:not(.wp-admin) :is(.zbv-wrap > .zbv-head, .vm-fe-header, .fm-fe-header, .mv-head):not(.mv-app *, .zbv-standalone *)::after,
    body.zbv-kopf:not(.wp-admin) :is(.be-wrap > .be-title, .vipm-scan > h2)::after {
        content: ""; display: block; flex: none; width: clamp(200px, 24vw, 290px); aspect-ratio: 720 / 320; height: auto;
        background: var(--zbv-kopf-dunkel) no-repeat right bottom / contain; opacity: .92; pointer-events: none;
    }
    body.zbv-kopf:not(.wp-admin) :is(.zbv-wrap > .zbv-head, .vm-fe-header, .fm-fe-header, .mv-head):not(.mv-app *, .zbv-standalone *)::after {
        grid-column: 2; grid-row: 1 / span 4; align-self: end;
    }

    /* Seiten ohne Kopfzeile (öffentliche Formulare, Anmeldung): Grafik als Band oben rechts */
    body.zbv-kopf:not(.wp-admin) :is(.vm-wrap, .fm-wrap, .mv-wrap, .zbv-wrap):not(.vipm-scan):not(:is(.vm-wrap, .fm-wrap, .mv-wrap, .be-wrap, .zbv-wrap, .mv-app, .zbv-standalone) *):not(:has(.vm-fe-header, .fm-fe-header, .mv-head, .zbv-head, .vipm-scan > h2))::before {
        content: ""; display: block; width: 100%; height: clamp(90px, 10.6vw, 129px); margin: 0 0 18px; padding-bottom: 14px;
        background: var(--zbv-kopf-dunkel) no-repeat right top / auto calc(100% - 14px);
        border-bottom: 1px solid var(--zp-line, rgba(255,255,255,.25)); opacity: .92; box-sizing: border-box;
    }
}

/* Lizenz-Hinweis (ab 1.4.0) */
.zbv-lizenz-band { position: fixed; left: 12px; bottom: 12px; z-index: 99999; max-width: calc(100% - 24px); padding: 7px 12px; border-radius: 8px; font: 13px/1.4 system-ui, sans-serif; background: #fff4e5; color: #8a4b00; border: 1px solid #f5c58a; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.zbv-lizenz-band.zbv-lizenz-gesperrt { background: #fdecea; color: #8a1c1c; border-color: #f2b8b5; }
.zbv-lizenz-band a { color: inherit; font-weight: 600; margin-left: 6px; }
.zbv-lizenz-tab td, .zbv-lizenz-tab th { padding: 6px 10px; text-align: left; border-bottom: 1px solid rgba(127,127,127,.25); }
.zbv-lz-ok { color: color-mix(in srgb, #8ce99a, #000 var(--zp-dunkel, 0%)); font-weight: 600; } .zbv-lz-kulanz { color: color-mix(in srgb, #ffc078, #000 var(--zp-dunkel, 0%)); font-weight: 600; } .zbv-lz-gesperrt { color: color-mix(in srgb, #ffa8a8, #000 var(--zp-dunkel, 0%)); font-weight: 600; }
body.wp-admin .zbv-lz-ok { color: #2b8a3e; } body.wp-admin .zbv-lz-kulanz { color: #c25e00; } body.wp-admin .zbv-lz-gesperrt { color: #c92a2a; }
.zbv-kopf-vorschau { max-width: 290px; max-height: 130px; display: block; margin: 6px 0; background: #1d2a44; padding: 6px; border-radius: 6px; }
.zbv-kopf-vorschau.zbv-auf-hell { background: #f3f4f6; }

/* ---- Menüleiste (ab 1.5.0) ---- */
.zbv-menue { --mn: var(--zbv-farbe, #1c4f8c); position: sticky; top: 0; z-index: 9990; background: var(--mn); background-image: linear-gradient(rgba(0,0,0,.28), rgba(0,0,0,.28)); color: #fff; font: 15px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; box-shadow: 0 2px 6px rgba(0,0,0,.18); }
body.admin-bar .zbv-menue { top: 32px; }
@media (max-width: 782px) { body.admin-bar .zbv-menue { top: 0; } }
.zbv-menue * { box-sizing: border-box; }
.zbv-mn-in { max-width: 1400px; margin: 0 auto; display: flex; align-items: center; gap: 6px; padding: 0 14px; min-height: 50px; }
.zbv-mn-marke { color: var(--zp-text, #fff) !important; text-decoration: none !important; font-weight: 700; font-size: 17px; white-space: nowrap; margin-right: 14px; display: flex; align-items: center; }
.zbv-mn-marke img { max-height: 34px; width: auto; display: block; }
.zbv-mn-liste { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 2px; flex: 1; flex-wrap: wrap; }
.zbv-mn-liste li { margin: 0; padding: 0; list-style: none; }
.zbv-mn-punkt { position: relative; }
.zbv-mn-punkt > a, .zbv-mn-punkt > button { display: block; color: var(--zp-text, #fff) !important; text-decoration: none !important; background: none; border: 0; font: inherit; padding: 14px 11px; cursor: pointer; border-radius: 0; line-height: 1.3; white-space: nowrap; box-shadow: none; text-transform: none; letter-spacing: 0; min-height: 0; }
.zbv-mn-punkt > a:hover, .zbv-mn-punkt > button:hover, .zbv-mn-auf > button { background: var(--zp-soft, rgba(255,255,255,.14)); }
.zbv-mn-aktiv > a, .zbv-mn-aktiv > button { box-shadow: inset 0 -3px 0 #fff; }
.zbv-mn-pfeil { font-size: 11px; opacity: .8; }
.zbv-mn-liste .zbv-mn-konto { margin-left: auto; }
.zbv-mn-hat > ul { display: none; position: absolute; left: 0; top: 100%; min-width: 220px; background: #fff; color: #222; list-style: none; margin: 0; padding: 6px 0; border-radius: 0 0 8px 8px; box-shadow: 0 8px 20px rgba(0,0,0,.2); }
.zbv-mn-konto > ul { left: auto; right: 0; }
.zbv-mn-auf > ul { display: block; }
.zbv-mn-hat > ul a { display: block; padding: 9px 16px; color: #222 !important; text-decoration: none !important; white-space: nowrap; }
.zbv-mn-hat > ul a:hover { background: #eef3fa; }
.zbv-mn-hat > ul a[aria-current] { font-weight: 700; }
.zbv-mn-toggle { display: none; margin-left: auto; background: none; border: 0; color: var(--zp-text, #fff); font-size: 24px; padding: 8px 6px; cursor: pointer; line-height: 1; }
@media (max-width: 900px) {
  .zbv-mn-in { flex-wrap: wrap; }
  .zbv-mn-toggle { display: block; }
  .zbv-mn-liste { display: none; flex-basis: 100%; flex-direction: column; align-items: stretch; padding-bottom: 8px; }
  .zbv-mn-offen .zbv-mn-liste { display: flex; }
  .zbv-mn-punkt > a, .zbv-mn-punkt > button { width: 100%; text-align: left; padding: 11px 8px; }
  .zbv-mn-liste .zbv-mn-konto { margin-left: 0; border-top: 1px solid var(--zp-line, rgba(255,255,255,.25)); }
  .zbv-mn-hat > ul { position: static; box-shadow: none; border-radius: 6px; margin: 0 0 6px 10px; min-width: 0; }
  .zbv-mn-aktiv > a, .zbv-mn-aktiv > button { box-shadow: inset 3px 0 0 #fff; }
}
@media print { .zbv-menue { display: none !important; } }
.zbv-menue-tab input[type=text] { width: 100%; }
.zbv-mit-menue [id] { scroll-margin-top: 70px; }
.zbv-copy { text-align: center; font: 11px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; color: #868e96; padding: 10px 16px 16px; }
@media print { .zbv-copy { display: none; } }
/* ab 1.8.0: Kachel eines Moduls mit gesperrter Lizenz */
.zbv-app-lock { font-style: normal; font-weight: 600; font-size: .72rem; padding: 1px 7px; margin-left: 6px; border-radius: 9px; background: var(--zp-soft2, rgba(255,255,255,.9)); color: #8a4b00; vertical-align: middle; white-space: nowrap; }

/* Gast-Zugang (ab 2.1.0) */
.zbv-gast { margin-top: 6px; }
.zbv-gast-trenner { display: flex; align-items: center; gap: 10px; color: inherit; opacity: .8; font-size: 13px; margin: 8px 0 10px; }
.zbv-gast-trenner::before, .zbv-gast-trenner::after { content: ""; flex: 1; border-top: 1px solid currentColor; opacity: .45; }
.zbv-gast-btn { width: 100%; }
.zbv-gast-info { background: #eef4ff; border: 1px solid #c9d8f5; border-radius: 8px; padding: 10px 14px; margin: 0 0 14px; }
.zbv-gast-tabelle { border-collapse: collapse; width: 100%; margin: 6px 0 12px; }
.zbv-gast-tabelle th, .zbv-gast-tabelle td { text-align: left; padding: 6px 8px; border-bottom: 1px solid #e3e8ef; vertical-align: top; }
.zbv-gast-tabelle td:first-child { white-space: nowrap; width: 1%; padding-right: 28px; }

/* ab 2.7.0: Mails (Mailserver + Versandprotokoll) */
.zbv-mail .zbv-field label { display: block; }
.zbv-mail .zbv-field label input[type=radio], .zbv-mail .zbv-field label input[type=checkbox] { width: auto; margin-right: 6px; }
.zbv-mail-row { display: flex; gap: 12px; flex-wrap: wrap; }
.zbv-mail-row > .zbv-field { flex: 1 1 200px; min-width: 0; }
.zbv-mail-row > .zbv-mail-port, .zbv-mail .zbv-mail-port { flex: 0 0 110px; max-width: 160px; }
.zbv-mail-test { display: inline-flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.zbv-mail-test input { width: 260px !important; max-width: 100%; }
.zbv-mail-filter { display: flex; gap: 8px; flex-wrap: wrap; margin: 8px 0 12px; }
.zbv-mail-filter select, .zbv-mail-filter input { width: auto !important; max-width: 100%; flex: 0 1 auto; }
.zbv-mail-filter input[type=search] { flex: 1 1 200px; }
.zbv-mail-tab td { font-size: .88rem; }
.zbv-nowrap { white-space: nowrap; }
.zbv-mail-st { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: .8rem; background: #eee; color: #444; white-space: nowrap; }
.zbv-mail-st-gesendet { background: #e3f4e6; color: #1d6b2c; }
.zbv-mail-st-fehler { background: #fde4e4; color: #a12020; }
.zbv-mail-st-unterwegs { background: #fff4d6; color: #7a5a00; }
.zbv-mail-fehler { color: #a12020; }
.zbv-mail-seiten { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 10px; }

/* ab 2.7.0: Zwei-Faktor-Anmeldung */
.zbv-code-input { font-size: 1.6rem !important; letter-spacing: .4em; text-align: center; font-family: monospace; max-width: 220px; }
.zbv-2fa label input[type=radio], .zbv-2fa label input[type=checkbox] { width: auto; margin-right: 6px; }
.zbv-2fa .zbv-field label { display: block; }