/**
 * Arztiva PAT - Patientenregistrierung
 * Datei: /pat/css/register.css
 */
.pat-register-page,.pat-register-page *{box-sizing:border-box}
.pat-register-page{min-height:100vh;padding:calc(20px + var(--az-safe-top,0px)) 14px calc(30px + var(--az-safe-bottom,0px));background:radial-gradient(circle at 12% 8%,rgba(0,122,255,.16),transparent 34%),linear-gradient(180deg,var(--az-bg,#f2f2f7) 0%,#fff 100%)}
.pat-register-shell{width:100%;max-width:980px;margin:0 auto;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:22px;align-items:start}
.pat-register-head{position:sticky;top:20px;padding:22px 4px}
.pat-register-logo{width:min(310px,80vw);height:auto;display:block;margin-bottom:22px}
.pat-register-eyebrow{color:var(--az-primary,#007AFF);font-size:.76rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em}
.pat-register-head h1{margin:12px 0 0;font-size:clamp(2.1rem,5.5vw,4rem);line-height:1.02;letter-spacing:-.055em;font-weight:720}
.pat-register-head p{margin:18px 0 0;color:var(--az-muted,#6e6e73);font-size:1.04rem}
.pat-register-card{margin-top:0!important;overflow:hidden}
.pat-register-progress{width:100%;height:8px;background:rgba(0,122,255,.12);border-radius:999px;overflow:hidden;margin-bottom:22px}
.pat-progress-bar{width:12.5%;height:100%;background:var(--az-primary,#007AFF);border-radius:999px;transition:width .2s ease}
.pat-step{display:none}.pat-step.is-active{display:block}
.pat-step h2{margin:0;font-size:clamp(1.45rem,4vw,2rem);letter-spacing:-.035em;font-weight:700}
.pat-step p{margin:8px 0 20px}
.pat-mode-grid{display:grid;grid-template-columns:1fr;gap:12px}
.pat-mode-card{border:1px solid var(--az-border,#d1d1d6);background:var(--az-card-soft,#eaf4ff);border-radius:20px;min-height:128px;padding:18px;cursor:pointer;display:grid;gap:8px;text-align:left;color:var(--az-text,#1c1c1e)}
.pat-mode-card:hover{border-color:var(--az-primary,#007AFF);box-shadow:0 8px 22px rgba(0,122,255,.15)}
.pat-mode-card i{font-size:2rem;color:var(--az-primary,#007AFF)}
.pat-mode-card span{color:var(--az-muted,#6e6e73);font-size:.9rem}
.pat-field-grid,.pat-upload-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pat-field-grid.street{grid-template-columns:minmax(0,1fr) minmax(90px,140px)}
.pat-upload-box{border:1px dashed var(--az-primary,#007AFF);border-radius:18px;padding:20px;min-height:150px;background:rgba(0,122,255,.06);display:grid;align-content:center;justify-items:center;gap:8px;text-align:center;cursor:pointer}
.pat-upload-box i{font-size:2rem;color:var(--az-primary,#007AFF)}.pat-upload-box input{display:none}
.pat-check{display:flex;align-items:flex-start;gap:9px;padding:12px;margin-top:14px;border:1px solid var(--az-border,#d1d1d6);border-radius:14px;background:rgba(0,122,255,.05);font-size:.9rem;font-weight:600}
.pat-check input{margin-top:3px}
.pat-actions{display:grid;grid-template-columns:.8fr 1.2fr;gap:10px;margin-top:18px}
.pat-practice-result{border:1px solid var(--az-border,#d1d1d6);border-radius:18px;padding:16px;background:rgba(0,122,255,.06);min-height:82px;margin-bottom:14px}
.pat-practice-result strong{display:block;color:var(--az-primary,#007AFF);margin-bottom:4px}
.pat-code-input{text-align:center;font-size:1.4rem;letter-spacing:.18em;font-weight:700}
.az-form-group label,.az-btn{font-weight:650}.az-btn-primary:hover{background:#4646FF}.az-btn-secondary:hover{background:#DBDBDB}
@media(max-width:880px){.pat-register-shell{grid-template-columns:1fr}.pat-register-head{position:static;padding:4px 0 0}.pat-register-logo{width:min(260px,78vw);margin-bottom:14px}}
@media(max-width:620px){.pat-register-page{padding-left:12px;padding-right:12px}.pat-register-head h1{font-size:clamp(2rem,11vw,2.9rem)}.pat-field-grid,.pat-upload-grid,.pat-field-grid.street{grid-template-columns:1fr}.pat-actions{grid-template-columns:1fr}.pat-register-card{padding:16px;border-radius:18px}}
@media(prefers-color-scheme:dark){.pat-register-page{background:radial-gradient(circle at 12% 8%,rgba(0,122,255,.22),transparent 34%),var(--az-bg,#000)}.pat-mode-card,.pat-upload-box,.pat-check,.pat-practice-result{background:rgba(28,28,30,.78);border-color:var(--az-border,#2c2c2e)}.az-btn-secondary:hover{color:#000}}


/* Ausweisfoto Vorschau */
.pat-upload-box{position:relative;overflow:hidden;}
.pat-upload-placeholder{display:grid;justify-items:center;gap:8px;}
.pat-upload-placeholder small{color:var(--az-muted,#6e6e73);font-weight:600;word-break:break-word;}
.pat-upload-preview{width:100%;display:block;}
.pat-upload-preview img{width:100%;height:190px;display:block;object-fit:cover;border-radius:14px;border:1px solid rgba(0,122,255,.22);background:#fff;}
.pat-upload-box.has-preview{align-content:stretch;padding:10px;}
.pat-upload-box.has-preview .pat-upload-placeholder{margin-top:10px;}
.pat-upload-box.has-preview .pat-upload-placeholder i{display:none;}
.pat-id-preview-actions{margin-top:12px;}
.pat-id-preview-modal{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.pat-id-preview-modal img{width:100%;border-radius:14px;border:1px solid var(--az-border,#d1d1d6);}
@media(max-width:620px){.pat-id-preview-modal{grid-template-columns:1fr;}}


.pat-ai-progress-overlay {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.62);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.pat-ai-progress-overlay[hidden] {
    display: none;
}

.pat-ai-progress-box {
    width: min(460px, 100%);
    border-radius: 24px;
    background: var(--az-card, #fff);
    color: var(--az-text, #1c1c1e);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
    padding: 24px;
    text-align: center;
    border: 1px solid var(--az-border, rgba(0,122,255,0.18));
}

.pat-ai-progress-icon {
    width: 58px;
    height: 58px;
    margin: 0 auto 16px;
    border-radius: 999px;
    background: rgba(0,122,255,0.12);
    color: var(--az-primary, #007AFF);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.55rem;
}

.pat-ai-progress-box h3 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 750;
    letter-spacing: -0.03em;
}

.pat-ai-progress-box p {
    margin: 8px 0 18px;
    color: var(--az-muted, #6e6e73);
    font-size: 0.94rem;
}

.pat-ai-progress-track {
    width: 100%;
    height: 12px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(0,122,255,0.14);
}

.pat-ai-progress-bar {
    height: 100%;
    width: 8%;
    border-radius: 999px;
    background: var(--az-primary, #007AFF);
    transition: width 0.35s ease;
}

.pat-ai-progress-percent {
    margin-top: 10px;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--az-primary, #007AFF);
}

.pat-ai-progress-small {
    display: block;
    margin-top: 12px;
    color: var(--az-muted, #6e6e73);
    font-size: 0.78rem;
}

@media (prefers-color-scheme: dark) {
    .pat-ai-progress-box {
        background: #1c1c1e;
        color: #fff;
        border-color: #2c2c2e;
    }

    .pat-ai-progress-box p,
    .pat-ai-progress-small {
        color: #a1a1aa;
    }
}


/* Passwortfeld: Auge sicher klickbar machen */
.az-password-wrap {
    position: relative;
    display: block;
    width: 100%;
}

.az-password-wrap .az-input {
    padding-right: 52px;
}

.az-password-toggle {
    position: absolute;
    top: 50%;
    right: 8px;
    width: 40px;
    height: 40px;
    transform: translateY(-50%);
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--az-muted, #6e6e73);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 5;
    touch-action: manipulation;
}

.az-password-toggle:hover,
.az-password-toggle:focus {
    background: rgba(0, 122, 255, 0.12);
    color: var(--az-primary, #007AFF);
    outline: none;
}

.az-password-toggle.is-visible {
    color: var(--az-primary, #007AFF);
    background: rgba(0, 122, 255, 0.12);
}

/* ==========================================================
   Button-Reihenfolge Patientenregistrierung
   Wichtig:
   - Auf Desktop bleibt Zurück links und Weiter rechts.
   - Auf Smartphone steht der Hauptbutton oben.
   - Zurück steht darunter.
   ========================================================== */

.pat-actions .az-btn-primary {
    order: 2;
}

.pat-actions .az-btn-secondary {
    order: 1;
}

@media (max-width: 620px) {
    .pat-actions {
        grid-template-columns: 1fr;
    }

    .pat-actions .az-btn-primary {
        order: 1;
    }

    .pat-actions .az-btn-secondary {
        order: 2;
    }
}

/* ==========================================================
   Passwort-Klartextschalter: harter Fix
   ========================================================== */

.az-password-wrap {
    position: relative;
    display: block;
    width: 100%;
}

.az-password-wrap .az-input {
    padding-right: 58px !important;
}

.az-password-toggle {
    position: absolute !important;
    top: 50% !important;
    right: 6px !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    transform: translateY(-50%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: var(--az-muted, #6e6e73) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 50 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent;
}

.az-password-toggle i {
    pointer-events: none;
}

.az-password-toggle:hover,
.az-password-toggle:focus,
.az-password-toggle.is-visible {
    background: rgba(0, 122, 255, 0.12) !important;
    color: var(--az-primary, #007AFF) !important;
    outline: none !important;
}

/* Hinweisbox bei fehlender Praxiszuordnung */
.pat-practice-result small {
    display: block;
    margin-top: 8px;
    color: var(--az-muted, #6e6e73);
    font-size: 0.82rem;
    line-height: 1.35;
}

/* Passwort-Klartextschalter: harter Fix */
.az-password-wrap {
    position: relative;
    display: block;
    width: 100%;
}

.az-password-wrap .az-input {
    padding-right: 58px !important;
}

.az-password-toggle {
    position: absolute !important;
    top: 50% !important;
    right: 6px !important;
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    transform: translateY(-50%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: var(--az-muted, #6e6e73) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 50 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent;
}

.az-password-toggle i {
    pointer-events: none;
}

.az-password-toggle:hover,
.az-password-toggle:focus,
.az-password-toggle.is-visible {
    background: rgba(0, 122, 255, 0.12) !important;
    color: var(--az-primary, #007AFF) !important;
    outline: none !important;
}

/* Button-Reihenfolge Patientenregistrierung */
.pat-actions .az-btn-primary {
    order: 2;
}

.pat-actions .az-btn-secondary {
    order: 1;
}

@media (max-width: 620px) {
    .pat-actions {
        grid-template-columns: 1fr;
    }

    .pat-actions .az-btn-primary {
        order: 1;
    }

    .pat-actions .az-btn-secondary {
        order: 2;
    }
}



/* Passwort-Klartextschalter v9: keine Überdeckung, keine Doppelklick-Probleme */
.az-password-wrap {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

.az-password-wrap .az-input {
    padding-right: 60px !important;
}

.az-password-toggle {
    position: absolute !important;
    top: 50% !important;
    right: 6px !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    transform: translateY(-50%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: var(--az-muted, #6e6e73) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 999 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    user-select: none !important;
}

.az-password-toggle i {
    pointer-events: none !important;
}

.az-password-toggle:hover,
.az-password-toggle:focus,
.az-password-toggle.is-visible {
    background: rgba(0, 122, 255, 0.12) !important;
    color: var(--az-primary, #007AFF) !important;
    outline: none !important;
}


/* Geburtsdatum als optionales Einzelfeld */
.pat-single-field {
    margin-top: 14px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

/* KV-Karte per Kamera */
.pat-kv-input-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 48px;
    gap: 8px;
    align-items: center;
}

.pat-kv-camera-btn {
    min-height: 46px;
    border-radius: 14px;
    background: rgba(0,122,255,0.12);
    color: var(--az-primary, #007AFF);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin: 0;
    border: 1px solid rgba(0,122,255,0.22);
}

.pat-kv-camera-btn:hover {
    background: rgba(0,122,255,0.20);
}

.pat-kv-scan-box {
    margin-top: 14px;
    border: 1px solid var(--az-border, #d1d1d6);
    border-radius: 18px;
    padding: 14px;
    background: rgba(0,122,255,0.05);
    display: grid;
    gap: 10px;
}

.pat-kv-scan-box[hidden] {
    display: none;
}

.pat-kv-preview {
    border-radius: 14px;
    overflow: hidden;
    background: #111;
}

.pat-kv-preview[hidden] {
    display: none;
}

.pat-kv-preview img {
    width: 100%;
    max-height: 220px;
    object-fit: contain;
    display: block;
}

.pat-kv-scan-box small {
    color: var(--az-muted, #6e6e73);
    font-size: 0.82rem;
}

@media (max-width: 620px) {
    .pat-single-field {
        grid-template-columns: 1fr;
    }
}


/* Arztiva Minimal-Registrierung v11 */
.pat-consent-box {
    border: 1px solid var(--az-border, #d1d1d6);
    border-radius: 18px;
    padding: 16px;
    background: rgba(0,122,255,0.06);
}

.pat-consent-box p {
    margin: 8px 0 0;
}

.pat-single-field {
    margin-top: 14px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.pat-username-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

.pat-username-row .az-btn {
    white-space: nowrap;
}

.pat-full-btn {
    width: 100%;
    margin-top: 12px;
}

.pat-upload-preview {
    display: block;
    width: 100%;
    margin-top: 10px;
    border-radius: 14px;
    overflow: hidden;
    background: #111;
}

.pat-upload-preview[hidden] {
    display: none;
}

.pat-upload-preview img {
    width: 100%;
    max-height: 180px;
    object-fit: contain;
    display: block;
}

.pat-id-preview-modal {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.pat-id-preview-modal img {
    width: 100%;
    max-height: 55vh;
    object-fit: contain;
    background: #111;
    border-radius: 12px;
    margin-top: 8px;
}

@media (max-width: 620px) {
    .pat-single-field,
    .pat-username-row,
    .pat-id-preview-modal {
        grid-template-columns: 1fr;
    }
}

/* Passwort-Klartextanzeige für set-password */
.az-password-wrap {
    position: relative !important;
    display: block !important;
    width: 100% !important;
}

.az-password-wrap .az-input {
    padding-right: 60px !important;
}

.az-password-toggle {
    position: absolute !important;
    top: 50% !important;
    right: 6px !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    transform: translateY(-50%) !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: var(--az-muted, #6e6e73) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 999 !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: transparent !important;
    user-select: none !important;
}

.az-password-toggle i {
    pointer-events: none !important;
}

.az-password-toggle:hover,
.az-password-toggle:focus,
.az-password-toggle.is-visible {
    background: rgba(0, 122, 255, 0.12) !important;
    color: var(--az-primary, #007AFF) !important;
    outline: none !important;
}



/* Arztiva v1.4: Placeholder im Dark-Mode bewusst schwächer als echter Text */
input::placeholder,
textarea::placeholder,
.az-input::placeholder,
.swal2-input::placeholder,
.swal2-textarea::placeholder,
.form-control::placeholder {
    color: #8e8e93 !important;
    opacity: 1 !important;
    font-weight: 500 !important;
}

@media (prefers-color-scheme: dark) {
    input::placeholder,
    textarea::placeholder,
    .az-input::placeholder,
    .swal2-input::placeholder,
    .swal2-textarea::placeholder,
    .form-control::placeholder {
        color: #8e8e93 !important;
        opacity: 1 !important;
        font-weight: 500 !important;
        -webkit-text-fill-color: #8e8e93 !important;
    }
}

html.dark input::placeholder,
html.dark textarea::placeholder,
body.dark input::placeholder,
body.dark textarea::placeholder,
body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder,
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder,
[data-bs-theme="dark"] input::placeholder,
[data-bs-theme="dark"] textarea::placeholder {
    color: #8e8e93 !important;
    opacity: 1 !important;
    font-weight: 500 !important;
    -webkit-text-fill-color: #8e8e93 !important;
}
