/* ZeroGold – Versandtaschen-Formular
   Das Aussehen kommt aus dem ZeroGold-Theme (Klassen request-card, bag-modal, field, btn).
   Hier stehen nur Zustände des Plugins und schlichte Rückfall-Stile; alle Rückfall-Regeln
   stehen in :where() und haben damit keine Spezifität – die Theme-Stile haben immer Vorrang. */

.zgvt-hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }

form[data-zgvt-form].is-loading { cursor: progress; }
form[data-zgvt-form].is-loading [type="submit"] { cursor: progress; opacity: 0.7; }
form[data-zgvt-form] .form-note.is-success { color: inherit; }

/* Rückfall ohne ZeroGold-Theme */
:where(.zgvt-form) { max-width: 560px; }
:where(.zgvt-form) :where(.visually-hidden) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:where(.zgvt-form) :where(.request-card__fields, .bag-modal__fields) { display: flex; flex-wrap: wrap; gap: 12px; margin: 16px 0; }
:where(.zgvt-form) :where(.field) { display: block; flex: 1 1 calc(50% - 12px); min-width: 0; }
:where(.zgvt-form) :where(.field--wide, .bag-modal__field--wide) { flex-basis: 100%; }
:where(.zgvt-form) :where(.field input) { box-sizing: border-box; width: 100%; padding: 12px 14px; border: 1px solid #c9c9c9; border-radius: 6px; font: inherit; }
:where(.zgvt-form) :where([aria-invalid="true"]) { border-color: #d64545; }
:where(.zgvt-form) :where([type="submit"]) { width: 100%; padding: 14px; border: 0; border-radius: 6px; background: #8a6d3b; color: #fff; font: inherit; cursor: pointer; }
:where(.zgvt-form) :where(.form-note.is-error) { color: #c13b3b; }

@media (max-width: 600px) {
  :where(.zgvt-form) :where(.field) { flex-basis: 100%; }
}

/* Links im Rechtshinweis der Karte erkennbar machen (wie die Links im Zustimmungstext des Themes) */
form[data-zgvt-form] .request-card__legal a { text-decoration: underline; text-underline-position: from-font; }

/* Adressvorschläge unter dem Straßenfeld (Farben und Schriften aus dem ZeroGold-Theme, mit Rückfallwerten) */
form[data-zgvt-form] .zgvt-ac { position: relative; }
form[data-zgvt-form] .zgvt-ac__panel {
  position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 30;
  background: var(--c-white, #fff); border: 1px solid var(--c-grey-10, #e8e8e8); border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12); overflow: hidden; text-align: left;
}
form[data-zgvt-form] .zgvt-ac__panel[hidden],
form[data-zgvt-form] .zgvt-ac__hint[hidden] { display: none; }
form[data-zgvt-form] .zgvt-ac__list { list-style: none; margin: 0; padding: 4px 0; max-height: 304px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; }
form[data-zgvt-form] .zgvt-ac__option {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; column-gap: 12px; row-gap: 2px;
  padding: 10px 20px; cursor: pointer; font: 400 14px/1.4 var(--f-input, inherit); color: var(--c-dark, #0b0b0b);
}
form[data-zgvt-form] .zgvt-ac__option:hover { background: #f7f5ef; }
form[data-zgvt-form] .zgvt-ac__option[aria-selected="true"] { background: var(--c-sand, #eeeadb); box-shadow: inset 3px 0 0 var(--c-gold, #9f8b6a); }
form[data-zgvt-form] .zgvt-ac__street { min-width: 0; overflow-wrap: anywhere; }
form[data-zgvt-form] .zgvt-ac__place { min-width: 0; font-size: 12px; color: var(--c-grey-60, #7c7c7c); overflow-wrap: anywhere; }
form[data-zgvt-form] .zgvt-ac__credit {
  margin: 0; padding: 6px 20px 8px; border-top: 1px solid var(--c-grey-10, #e8e8e8);
  font: 400 10px/1.4 var(--f-sans, inherit); color: var(--c-grey-60, #7c7c7c);
}
form[data-zgvt-form] .zgvt-ac__credit a { color: inherit; text-decoration: underline; }
form[data-zgvt-form] .zgvt-ac__hint {
  box-sizing: border-box; flex: 0 0 100%; width: 100%; grid-column: 1 / -1;
  padding: 12px 16px; border-radius: 8px; background: var(--c-sand, #eeeadb);
  font: 400 12px/1.5 var(--f-input, inherit); color: var(--c-grey-90, #424242); text-align: left;
}
form[data-zgvt-form] .zgvt-ac__hint p { margin: 0; }
form[data-zgvt-form] .zgvt-ac__hint .zgvt-ac__hint-note { margin-top: 6px; color: var(--c-grey-60, #7c7c7c); }
form[data-zgvt-form] .zgvt-ac__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
form[data-zgvt-form] .zgvt-ac__chip {
  min-height: 32px; padding: 6px 12px; border: 1px solid var(--c-gold, #9f8b6a); border-radius: 999px;
  background: var(--c-white, #fff); font: 400 12px/1.2 var(--f-input, inherit); color: var(--c-dark, #0b0b0b); cursor: pointer;
}
form[data-zgvt-form] .zgvt-ac__chip:hover,
form[data-zgvt-form] .zgvt-ac__chip:focus-visible { background: var(--c-gold, #9f8b6a); color: var(--c-white, #fff); outline: none; }
@media (max-width: 600px) {
  form[data-zgvt-form] .zgvt-ac__option { padding: 12px 16px; }
  form[data-zgvt-form] .zgvt-ac__list { max-height: 260px; }
}

/* Hausnummer: Hinweis direkt unter dem Feld „Straße und Hausnummer“ (freiwillige Angabe) */
form[data-zgvt-form] .zgvt-hn-hint {
  box-sizing: border-box; flex: 0 0 100%; width: 100%; grid-column: 1 / -1;
  margin: -8px 0 0; padding: 10px 16px; border-radius: 8px;
  background: var(--c-sand, #eeeadb); box-shadow: inset 3px 0 0 var(--c-gold, #9f8b6a);
  font: 400 12px/1.5 var(--f-input, inherit); color: var(--c-dark, #0b0b0b); text-align: left;
}
form[data-zgvt-form] .zgvt-hn-hint[hidden] { display: none; }

/* Bestätigungsabfrage „Hausnummer fehlt“: kompakte Karte, auf allen Bildschirmen mittig,
   Höhe nur so groß wie der Inhalt. Theme-Regeln für .btn (feste Höhe 50px, nowrap) werden hier gezielt überschrieben. */
.zgvt-confirm {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  padding: 16px; overflow-y: auto; overscroll-behavior: contain;
}
.zgvt-confirm[hidden] { display: none; }
.zgvt-confirm__backdrop { position: fixed; inset: 0; background: rgba(11, 11, 11, 0.55); opacity: 0; transition: opacity .2s ease; }
.zgvt-confirm__box {
  position: relative; box-sizing: border-box; flex: 0 1 auto; align-self: center;
  width: 100%; max-width: 400px; height: auto; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); overflow-y: auto;
  margin: auto; padding: 24px 24px 20px;
  border-radius: 12px;
  background: var(--c-white, #fff); color: var(--c-dark, #0b0b0b);
  box-shadow: 0 12px 32px rgba(11, 11, 11, 0.18), 0 2px 6px rgba(11, 11, 11, 0.08);
  text-align: left; outline: none;
  opacity: 0; transform: translateY(8px) scale(.98); transition: opacity .2s ease, transform .2s ease;
}
.zgvt-confirm.is-open .zgvt-confirm__backdrop,
.zgvt-confirm.is-open .zgvt-confirm__box { opacity: 1; transform: none; }
.zgvt-confirm__title { margin: 0; font: 400 20px/1.3 var(--f-serif, Georgia, serif); color: var(--c-dark, #0b0b0b); }
.zgvt-confirm__title::before { content: ''; display: block; width: 32px; height: 2px; margin-bottom: 12px; background: var(--c-gold, #9f8b6a); }
.zgvt-confirm__text { margin: 8px 0 0; font: 400 14px/1.5 var(--f-sans, system-ui, sans-serif); color: var(--c-grey-90, #424242); }
.zgvt-confirm__actions { display: flex; flex-direction: column; gap: 8px; margin-top: 20px; }
.zgvt-confirm .zgvt-confirm__btn {
  box-sizing: border-box; display: flex; align-items: center; justify-content: center;
  flex: 0 0 auto; width: 100%; height: auto; min-height: 44px; margin: 0; padding: 10px 16px;
  border: 1px solid var(--c-gold, #9f8b6a); border-radius: 4px;
  font: 700 14px/1.4 var(--f-button, inherit); white-space: normal; text-align: center; cursor: pointer;
  transition: background-color .2s, color .2s, border-color .2s;
}
.zgvt-confirm .zgvt-confirm__btn--primary { background: var(--c-gold, #9f8b6a); color: var(--c-white, #fff); }
.zgvt-confirm .zgvt-confirm__btn--primary:hover { background: var(--c-gold-hover, #8b7757); border-color: var(--c-gold-hover, #8b7757); }
.zgvt-confirm .zgvt-confirm__btn--secondary { background: var(--c-white, #fff); color: var(--c-gold-hover, #8b7757); }
.zgvt-confirm .zgvt-confirm__btn--secondary:hover { background: var(--c-gold, #9f8b6a); color: var(--c-white, #fff); }
.zgvt-confirm .zgvt-confirm__btn:focus-visible { outline: 2px solid var(--c-dark, #0b0b0b); outline-offset: 2px; }
/* Tablet/Desktop: Schaltflächen nebeneinander und gleich breit (bei 560 px Kartenbreite einzeilig). */
@media (min-width: 600px) {
  .zgvt-confirm__box { max-width: 560px; padding: 28px 28px 24px; }
  .zgvt-confirm__actions { flex-direction: row; gap: 12px; margin-top: 24px; }
  .zgvt-confirm .zgvt-confirm__btn { flex: 1 1 0; width: auto; padding-inline: 12px; }
}
/* Sehr kleine Smartphones (320 px) und niedrige Fenster, z. B. mit eingeblendeter Tastatur */
@media (max-width: 359px) {
  .zgvt-confirm { padding: 12px; }
  .zgvt-confirm__box { padding: 20px 16px 16px; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); }
  .zgvt-confirm__title { font-size: 18px; }
}
@media (max-height: 420px) {
  .zgvt-confirm { padding-top: 8px; padding-bottom: 8px; }
  .zgvt-confirm__box { padding-top: 16px; padding-bottom: 16px; max-height: calc(100dvh - 16px); }
  .zgvt-confirm__actions { margin-top: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .zgvt-confirm__backdrop, .zgvt-confirm__box { transition: none; }
}