/* Registrierung: helle Karte, keine Überlappungen, unabhängig vom System-Dark-Mode */
body.register-body {
    color-scheme: light;
    color: #16211c;
    min-height: 100vh;
    margin: 0;
    padding: calc(1.1rem + env(safe-area-inset-top, 0)) 1rem calc(1.8rem + env(safe-area-inset-bottom, 0));
    background:
        radial-gradient(900px 500px at 90% -10%, rgba(52, 211, 153, .5), transparent 60%),
        radial-gradient(700px 450px at -10% 100%, rgba(245, 158, 11, .28), transparent 60%),
        #0b3d2e;
    background-attachment: fixed;
}
.register-container {
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
}
.register-brand {
    display: block;
    text-align: center;
    margin: 0 0 1.05rem;
    color: #ecf3ef;
    font-weight: 800;
    font-size: 1.15rem;
    letter-spacing: -.02em;
    text-decoration: none;
}
.register-brand:hover { color: #fff; text-decoration: none; }

.register-card {
    background: #fff;
    color: #16211c;
    border: 1px solid rgba(255, 255, 255, .65);
    border-radius: 26px;
    padding: 1.75rem 1.4rem 1.5rem;
    box-shadow: 0 30px 70px rgba(0, 0, 0, .35);
}
.register-head { text-align: center; margin-bottom: 1.25rem; }
.register-title { font-size: 1.55rem; margin: 0 0 .3rem; font-weight: 800; letter-spacing: -.02em; color: #16211c; }
.register-sub { margin: 0; color: #55655d; font-size: .95rem; }

.register-card .form-icon {
    width: 56px; height: 56px; margin: 0 auto .75rem;
    border-radius: 18px; background: linear-gradient(135deg, #059669, #10b981 55%, #34d399);
    color: #fff; display: grid; place-items: center; font-size: 1.35rem;
    box-shadow: 0 10px 22px rgba(5, 150, 105, .35);
}

.register-card form { display: flex; flex-direction: column; gap: 0; }
.register-card .form-group { margin: 0 0 .9rem; position: static; }
.register-card .form-label {
    position: static;
    display: block;
    margin: 0 0 .35rem;
    font-size: .8rem;
    font-weight: 700;
    color: #3d5249;
    pointer-events: auto;
}
.register-card .form-input,
.register-card select,
.register-card input[type="text"],
.register-card input[type="email"],
.register-card input[type="password"],
.register-card input[type="tel"] {
    display: block;
    width: 100%;
    min-height: 48px;
    padding: .75rem .95rem;
    border: 1.5px solid #e3e9e5;
    border-radius: 14px;
    background: #fff;
    color: #16211c;
    font: inherit;
    font-size: 16px;
    box-shadow: none;
}
.register-card .form-input:focus {
    outline: none;
    border-color: #10b981;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, .18);
}
.register-card .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .75rem;
    margin: 0;
}
.register-card .form-row .form-group { margin-bottom: .9rem; }

.type-switch {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: .65rem;
    margin: 0 0 1.15rem;
}
.type-option {
    display: block;
    position: relative;
    margin: 0;
    cursor: pointer;
}
.type-option input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    opacity: 0;
    min-height: 0;
    pointer-events: none;
}
.type-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .28rem;
    min-height: 96px;
    padding: .85rem .55rem;
    text-align: center;
    border-radius: 16px;
    border: 2px solid #e3e9e5;
    background: #f7faf8;
    color: #16211c;
    transition: border-color .15s, background .15s, box-shadow .15s;
}
.type-card i { font-size: 1.25rem; color: #059669; }
.type-card strong { display: block; font-size: .88rem; line-height: 1.2; }
.type-card small { display: block; color: #6b7c74; font-size: .72rem; line-height: 1.3; font-weight: 500; }
.type-option input:checked + .type-card {
    border-color: #10b981;
    background: #ecfdf5;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, .16);
}
.type-option:hover .type-card { border-color: #a7f3d0; }

.shelter-fields {
    padding: 1rem .9rem .15rem;
    margin: 0 0 1rem;
    border-radius: 16px;
    background: #f4faf7;
    border: 1px dashed #a7f3d0;
}
.shelter-fields[hidden] { display: none !important; }

.register-card .check-row {
    display: flex;
    gap: .7rem;
    align-items: flex-start;
    margin: .15rem 0 1.1rem;
    font-size: .86rem;
    line-height: 1.45;
    color: #3d5249;
    cursor: pointer;
}
.register-card .check-row input[type="checkbox"] {
    flex: none;
    width: 1.15rem;
    height: 1.15rem;
    min-height: 0;
    margin-top: .2rem;
    accent-color: #059669;
}
.register-card .check-row a { color: #059669; font-weight: 700; }

.register-card .btn {
    width: 100%;
    min-height: 50px;
    margin-top: .15rem;
    border-radius: 14px;
}
.register-card .btn-forest { color: #fff; }
.register-card .btn-secondary {
    background: #fff;
    color: #065f46;
    border: 1.5px solid #d1fae5;
}

.register-foot {
    margin-top: 1.25rem;
    padding-top: 1.1rem;
    border-top: 1px solid #edf1ee;
    text-align: center;
}
.register-foot p { margin: 0 0 .65rem; color: #55655d; }

.register-legal {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .35rem .2rem;
    margin: 1.1rem 0 0;
    font-size: .84rem;
    font-weight: 600;
}
.register-legal a { color: rgba(236, 243, 239, .82); text-decoration: none; padding: .2rem .45rem; }
.register-legal a:hover { color: #fff; text-decoration: underline; }
.register-legal span { color: rgba(236, 243, 239, .35); }
.register-card .login-forgot { text-align: right; margin: -.35rem 0 .85rem; font-size: .9rem; }
.register-card .login-forgot a { color: #059669; font-weight: 700; text-decoration: none; }
.register-card .login-forgot a:hover { text-decoration: underline; }
.register-card .resend-box { margin-bottom: 1rem; }

@media (max-width: 420px) {
    .register-card { padding: 1.35rem 1.05rem 1.2rem; }
    .register-card .form-row { grid-template-columns: 1fr; }
    .type-card { min-height: 88px; padding: .7rem .4rem; }
    .type-card strong { font-size: .8rem; }
}