/* Vinvigna: Anmeldung, Weingut-Wahl und Fenster «Konto & Weingut» */
html.vc-gated, html.vc-modal { overflow: hidden }
.vc .helpbtn { display: none !important }         /* Hilfe-Assistent gibt es in Vinvigna vorerst nicht */
#vc-gate { position: fixed; inset: 0; z-index: 1000; background: var(--bg); overflow-y: auto; -webkit-overflow-scrolling: touch;
  padding: max(24px, env(safe-area-inset-top)) 16px max(32px, env(safe-area-inset-bottom)) }
.vc-box { max-width: 440px; margin: 4vh auto 0; display: flex; flex-direction: column; gap: 14px }
.vc-box .vlogo.vlogo-big { align-self: flex-start }
.vc-box h2 { font: 400 1.9rem/1.15 var(--f-display); margin: 8px 0 0 }
.vc-sub { margin: 0; color: var(--muted) }
.vc-who { margin: 0 }
.vc-form { display: flex; flex-direction: column; gap: 14px; margin: 0 }
.vc-field { display: flex; flex-direction: column; gap: 6px }
.vc-field label { font-weight: 600; font-size: .95rem }
.vc-field small { color: var(--muted); font-size: .85rem }
.vc-field input, #vc-konto select { font-size: 17px; min-height: 50px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); color: var(--ink); width: 100%; min-width: 0 }
.vc-field input:focus, #vc-konto select:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent) }
.vc-pw { position: relative; display: flex }
.vc-pw input { padding-right: 96px }
.vc-pw .vc-link { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); min-height: 42px; padding: 0 12px }
.vc-big { min-height: 52px; font-size: 1.05rem; border-radius: 10px; width: 100% }
.vc-link { background: none; border: 0; color: var(--accent); font: inherit; font-weight: 600; cursor: pointer; padding: 10px 4px; min-height: 44px; text-decoration: underline; text-underline-offset: 3px }
.vc-links { display: flex; flex-wrap: wrap; gap: 4px 18px }
.vc-note { margin: 0; color: var(--muted); font-size: .9rem }
.vc-note a, .vc-legal a { color: var(--accent); font-weight: 600; text-underline-offset: 3px }
.vc-note a { padding: 13px 2px; margin: -13px -2px }
.vc-legal { margin: 4px 0 0; padding-top: 10px; border-top: 1px solid var(--line); font-size: .9rem }
.vc-legal a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 4px }
a.vc-link { display: inline-flex; align-items: center }
.vc-alt { border-top: 1px solid var(--line); padding-top: 16px; display: flex; flex-direction: column; gap: 10px }
.vc-alt p { margin: 0; color: var(--muted) }
.vc-msg { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--accent-soft); color: var(--ink); font-size: .95rem }
.vc-msg.bad { background: color-mix(in srgb, var(--danger) 14%, var(--surface)); color: var(--ink); border-left: 4px solid var(--danger) }
.vc-list { display: flex; flex-direction: column; gap: 10px }
.vc-choice { text-align: left; display: flex; flex-direction: column; gap: 4px; padding: 16px; min-height: 64px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); color: var(--ink); cursor: pointer; font: inherit }
.vc-choice b { font-size: 1.1rem }
.vc-choice small { color: var(--muted); font-size: .92rem }
.vc-choice:hover, .vc-choice:focus-visible { border-color: var(--accent) }

/* im Menü «Mehr» */
.vc-tag { font-weight: 700; padding: 8px 10px 2px; font-size: .95rem; color: var(--ink) }
.vc-menu { display: flex; flex-direction: column; gap: 4px; border-top: 1px solid var(--line); margin-top: 4px; padding-top: 4px }

/* Fenster «Konto & Weingut» */
#vc-konto { position: fixed; inset: 0; z-index: 900; background: color-mix(in srgb, #000 45%, transparent); display: flex; justify-content: center; align-items: flex-start; overflow: hidden }
.vc-sheet { background: var(--bg); width: min(620px, 100%); max-height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
  padding: 0 16px max(24px, env(safe-area-inset-bottom)); box-shadow: 0 10px 40px rgba(0,0,0,.25) }
@media (min-width: 680px) { #vc-konto { padding: 4vh 16px } .vc-sheet { border-radius: 16px; max-height: 92vh } }
.vc-sheet header { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 8px; background: var(--bg);
  padding: max(12px, env(safe-area-inset-top)) 0 10px; border-bottom: 1px solid var(--line) }
.vc-sheet header h2 { font: 400 1.5rem/1.2 var(--f-display); margin: 0 }
.vc-sheet header .btn { min-width: 48px; min-height: 48px; font-size: 1.2rem }
.vc-sheet section { padding: 16px 0; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 10px }
.vc-sheet section:last-child { border-bottom: 0 }
.vc-sheet h3 { margin: 0; font-size: 1.05rem }
.vc-big-name { margin: 0; font: 400 1.4rem/1.2 var(--f-display) }
.vc-sheet .btn { min-height: 46px; font-size: .95rem; display: inline-flex; align-items: center; justify-content: center }
.vc-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center }
.vc-code { margin: 0; display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; border-radius: 12px; background: var(--surface); border: 1px dashed var(--accent) }
.vc-code span { font-size: .85rem; color: var(--muted); font-weight: 600 }
.vc-code b { font: 600 1.7rem/1.2 var(--f-data); letter-spacing: .12em; color: var(--ink); user-select: all }
.vc-mems { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px }
.vc-mem { padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); display: flex; flex-direction: column; gap: 10px }
.vc-mem-h { display: flex; gap: 10px; align-items: center; justify-content: space-between }
.vc-mem-h > div { display: flex; flex-direction: column; gap: 2px; min-width: 0 }
.vc-mem small { color: var(--muted); overflow-wrap: anywhere }
.vc-st { font-size: .85rem; font-weight: 600 }
.vc-st.ok { color: var(--accent) }
.vc-st.wait { color: var(--amber) }
.vc-st.gesperrt { color: var(--danger) }
.vc-map { display: flex; flex-direction: column; gap: 8px; border-top: 1px dashed var(--line); padding-top: 10px }
.vc-map label { font-size: .92rem }
.vc-map select { flex: 1 1 200px; width: auto; min-height: 46px; font-size: 16px }
.vc-act { display: flex; flex-direction: column; gap: 6px; align-items: flex-start }
.vc-act label.btn { cursor: pointer }
.vc-act label.btn[aria-disabled="true"] { opacity: .5; pointer-events: none }
.vc-imp { padding: 12px; border-radius: 12px; border: 1px solid var(--accent); background: var(--surface); display: flex; flex-direction: column; gap: 10px }
.vc-imp p { margin: 0 }
.vc-warn { color: var(--amber); font-weight: 600 }
@media (max-width: 420px) { .vc-sheet .vc-row .btn { flex: 1 1 100% } .vc-mem-h { flex-wrap: wrap } .vc-mem-h .btn { width: 100% } }
/* Meldungsleiste unten im Fenster, Bestätigungen */
.vc-k-foot { position: sticky; bottom: 0; z-index: 2; margin: 0 -16px; padding: 0 16px; background: linear-gradient(to bottom, transparent, var(--bg) 14px) }
.vc-k-foot:empty { display: none }
.vc-k-foot .vc-msg { margin: 8px 0 max(10px, env(safe-area-inset-bottom)); position: relative; padding-right: 48px; box-shadow: 0 4px 18px rgba(0,0,0,.14) }
.vc-x { position: absolute; top: 2px; right: 2px; width: 44px; height: 44px; border: 0; background: none; color: var(--muted); font-size: 1rem; cursor: pointer }
.vc-confirm { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-radius: 12px; border: 1px solid color-mix(in srgb, var(--danger) 45%, var(--line)); background: var(--surface) }
.vc-confirm p { margin: 0 }
.vc-link.danger { color: var(--danger) }
.vc-mem-f { display: flex; justify-content: flex-end; margin-top: -6px }
.vc-mem-f .vc-link { padding: 8px 4px; min-height: 40px; font-size: .9rem }
/* lange Namen ohne Leerzeichen umbrechen */
.vc-sheet, .vc-box { overflow-wrap: anywhere }
.vc-mem-h > div { flex: 1 1 auto }
/* Testseite: deutlich markiert */
.vc-testbar { position: fixed; top: env(safe-area-inset-top, 0px); left: 50%; transform: translateX(-50%); z-index: 1100; pointer-events: none;
  background: #9A4A00; color: #fff; font: 700 .78rem/1.2 var(--f-body, system-ui), sans-serif; letter-spacing: .02em; padding: 4px 12px 5px; border-radius: 0 0 9px 9px; white-space: nowrap; box-shadow: 0 2px 8px rgba(0,0,0,.2) }
/* Startseite (wer Vinvigna noch nicht kennt) */
.vc-box.vc-home { max-width: 760px; margin-top: 0; gap: 16px }
.vc-h-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px }
.vc-h-top > div { display: flex; flex-direction: column; gap: 2px; min-width: 0 }
.vc-h1 { font: 400 clamp(1.85rem, 7.2vw, 2.6rem)/1.12 var(--f-display); margin: 10px 0 0; hyphens: manual }
.vc-lead { margin: 0; font-size: 1.12rem; line-height: 1.5; color: var(--ink) }
.vc-cta { display: flex; flex-direction: column; gap: 10px }
@media (min-width: 560px) { .vc-cta { flex-direction: row } .vc-cta .vc-big { width: auto; flex: 1 1 0 } }
.vc-small { margin: 0; color: var(--muted); font-size: .92rem }
.vc-home section { display: flex; flex-direction: column; gap: 12px; padding-top: 18px; border-top: 1px solid var(--line) }
.vc-box.vc-home h2 { font: 400 1.45rem/1.2 var(--f-display); margin: 0 }
.vc-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 10px }
.vc-cards li { background: var(--surface); border: 1px solid var(--line); border-top: 4px solid var(--accent); border-radius: 4px 4px 14px 14px; padding: 12px 16px 14px; display: flex; flex-direction: column; gap: 4px }
.vc-cards b { font-size: 1.05rem }
.vc-cards span { color: var(--muted); font-size: .95rem; line-height: 1.45 }
.vc-pts, .vc-steps { margin: 0; padding-left: 1.3em; display: flex; flex-direction: column; gap: 8px }
.vc-steps li::marker { font-weight: 700; color: var(--accent) }
.vc-impressum { border-top: 1px solid var(--line); padding-top: 14px; font-size: .9rem; color: var(--muted); display: flex; flex-direction: column; gap: 2px }
.vc-impressum p { margin: 0 }
.vc-impressum .vc-links a { display: inline-flex; align-items: center; min-height: 44px }
.vc-box a.mail, .vc-impressum a, .vc-steps a { color: var(--accent); font-weight: 600; text-underline-offset: 3px }
.vc-box a.mail { white-space: nowrap }
/* Registrierung: Häkchen für die Vereinbarung, Gründungscode aufklappbar */
.vc-check { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); cursor: pointer; font-size: .98rem; line-height: 1.45 }
.vc-check input { width: 24px; height: 24px; flex: none; margin: 0; accent-color: var(--accent) }
.vc-check a { color: var(--accent); font-weight: 600; text-underline-offset: 3px }
.vc-check:focus-within { border-color: var(--accent) }
.vc-more { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); padding: 0 14px }
.vc-more > summary { min-height: 48px; display: flex; align-items: center; cursor: pointer; font-weight: 600; color: var(--accent) }
.vc-more[open] { padding-bottom: 12px; display: flex; flex-direction: column; gap: 10px }
.vc-sheet .vc-more { background: var(--bg) }
/* Konto-Fenster: Anmeldungen neuer Weingüter */
.vc-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.6em; height: 1.6em; padding: 0 .45em; margin-left: 4px; border-radius: 999px; background: var(--accent); color: var(--bg); font-size: .8rem; font-weight: 700; vertical-align: middle }
.vc-anm small a { color: var(--accent) }
.vc-mem-f { flex-wrap: wrap; gap: 0 16px }
.vc-sheet a.btn { text-decoration: none }
/* Befunde Testbenutzer */
.vc-field input[aria-invalid="true"] { border-color: var(--danger); outline: 2px solid color-mix(in srgb, var(--danger) 35%, transparent); outline-offset: 1px }
.vc-check:has(input[aria-invalid="true"]) { border-color: var(--danger) }
.vc-info { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--accent-soft); color: var(--ink); font-size: .95rem }
.vc-confirm.ok { border-color: color-mix(in srgb, var(--accent) 55%, var(--line)) }
#vc-k-anm { scroll-margin-top: 84px }
.vc-anm .vc-warn { margin: 4px 0 0; font-size: .92rem }