/* ── GUT NaturForum — Zugang Seite ──────────────────────────────────────── */

.gut-zugang-wrap {
    max-width: 560px;
    margin: 40px auto;
    padding: 0 16px 60px;
    font-family: 'DM Sans', sans-serif;
}

/* Toast Notification */
.gut-toast {
    position: fixed;
    top: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(-80px);
    background: #2d4a1e;
    color: #f6f8f0;
    padding: 14px 24px;
    border-radius: 10px;
    font: 500 14px/1 'DM Sans', sans-serif !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
    z-index: 99999;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    white-space: nowrap;
}

.gut-toast--visible {
    transform: translateX(-50%) translateY(0);
}

/* Karte (Bestätigungs-Banner, "bereits angemeldet" etc.) */
.gut-zugang-card {
    background: #fff;
    border: 1px solid #e0e8d0;
    border-radius: 14px;
    box-shadow: 0 2px 16px rgba(0,0,0,0.06);
}

/* 4 Optionen Grid */
.gut-zugang-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 8px;
}

.gut-zugang-option,
.gut-zugang-option:hover,
.gut-zugang-option:focus,
.gut-zugang-option:active {
    background: #fff;
    border: 2px solid #e0e8d0;
    border-radius: 12px;
    padding: 24px 16px;
    cursor: pointer;
    transition: border-color 0.18s, background 0.18s, transform 0.12s;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    font: 500 14px/1.3 'DM Sans', sans-serif !important;
    color: #2d4a1e !important;
    text-align: center;
    outline: none !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

.gut-zugang-option:hover {
    border-color: #5c7a3e !important;
    background: #f0f7e8 !important;
    transform: translateY(-2px);
}

.gut-zugang-option.active {
    border-color: #5c7a3e !important;
    background: #f0f7e8 !important;
    color: #2d4a1e !important;
}

.gut-zugang-icon {
    font-size: 28px;
    line-height: 1;
}

.gut-zugang-label {
    font: 500 13px/1.3 'DM Sans', sans-serif !important;
    color: #2d4a1e;
}

/* Formular Container */
.gut-zugang-forms {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.4s ease;
}

.gut-zugang-forms.open {
    max-height: 2000px;
}

/* Einzelnes Formular */
.gut-zugang-form {
    display: none;
    background: #fff;
    border-radius: 14px;
    padding: 28px;
    margin-top: 12px;
    box-shadow: 0 2px 16px rgba(0,0,0,0.06);
    animation: gut-slide-down 0.3s ease;
}

.gut-zugang-form.active {
    display: block;
}

@keyframes gut-slide-down {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}

.gut-zugang-form-title {
    font: 600 20px/1.2 'Lora', serif !important;
    color: #2d4a1e;
    margin: 0 0 20px;
    text-align: center;
}

/* Felder */
.gut-zf-field {
    margin-bottom: 10px;
    position: relative;
}

.gut-zf-field input[type="text"],
.gut-zf-field input[type="email"],
.gut-zf-field input[type="password"],
.gut-zf-field input[type="tel"],
.gut-zf-field input[type="url"],
.gut-zf-field textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #d0d5c8 !important;
    border-radius: 8px !important;
    font: normal 15px/1.5 'DM Sans', sans-serif !important;
    color: #2a2a2a !important;
    background: #fff !important;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.18s;
    box-shadow: none !important;
}

.gut-zf-field input:focus,
.gut-zf-field textarea:focus {
    border-color: #5c7a3e !important;
}

.gut-zf-field textarea {
    resize: vertical;
    min-height: 80px;
}

.gut-zf-row {
    display: flex;
    gap: 10px;
}

.gut-zf-plz {
    flex: 0 0 90px;
}

.gut-zf-grow {
    flex: 1;
}

.gut-pw-wrap input {
    padding-right: 42px !important;
}

.gut-pw-toggle {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
    color: #9aa090;
}

.gut-pw-toggle::before {
    content: '';
    display: block;
    width: 18px;
    height: 18px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239aa090' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: contain;
}

.gut-pw-toggle.gut-pw-visible::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235c7a3e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24'/%3E%3Cline x1='1' y1='1' x2='23' y2='23'/%3E%3C/svg%3E");
}

.gut-zf-divider {
    height: 1px;
    background: #e8ede0;
    margin: 14px 0;
}

.gut-zf-check {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 14px 0;
    font: normal 13px/1.5 'DM Sans', sans-serif !important;
    color: #6a7060;
}

.gut-zf-check input[type="checkbox"] {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    margin-top: 2px;
    accent-color: #5c7a3e;
    cursor: pointer;
}

.gut-zf-check a {
    color: #5c7a3e;
    text-decoration: underline;
}

.gut-zf-error {
    background: #fef0ef;
    border: 1px solid #f5c6c2;
    color: #b32d2e;
    padding: 12px 14px;
    border-radius: 8px;
    font: normal 13px/1.5 'DM Sans', sans-serif !important;
    margin-bottom: 10px;
}

.gut-zf-error--verify {
    background: #fff8e6;
    border-color: #f0d080;
    color: #7a5a00;
}

.gut-zf-error--pending {
    background: #e8f0fe;
    border-color: #a8c0f0;
    color: #1a3a7a;
}

.gut-zf-field-error {
    display: block;
    font: normal 12px/1.4 'DM Sans', sans-serif !important;
    color: #e05a4e;
    margin-top: 4px;
}

.gut-zf-resend-btn {
    background: none;
    border: 1px solid #c0d4a0;
    border-radius: 8px;
    color: #5c7a3e;
    font: 500 13px/1.5 'DM Sans', sans-serif !important;
    padding: 8px 18px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    margin-top: 4px;
}

.gut-zf-resend-btn:hover {
    background: #f0f7e8;
    border-color: #5c7a3e;
}

.gut-zf-resend-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
    text-align: center;
    margin-top: 16px;
    font: normal 13px/1 'DM Sans', sans-serif !important;
}

.gut-zf-links a {
    color: #5c7a3e;
    text-decoration: none;
}

/* Responsive */
@media (max-width: 420px) {
    .gut-zugang-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .gut-zugang-option {
        padding: 18px 10px;
    }
    .gut-zf-row {
        flex-direction: column;
        gap: 10px;
    }
    .gut-zf-plz {
        flex: none;
    }
}