/* ============================================================
   Auth.css — DreamPrint Login / Register / Passwort-Flows
   Neues 50/50 „Brand Story"-Layout. Global im _LayoutLogin
   geladen, alles unter .dp-auth-body gescoped.
   Linkes Ink-Marken-Panel (_AuthBrand.cshtml) + rechte
   Formular-Karte. Kupfer #C17A2F, Anthrazit #2D2D2D, Warmweiß #F5F2ED.
   ============================================================ */

.dp-auth-body{
    --ink:#2D2D2D; --gold:#C17A2F; --gold-deep:#A8691F; --bg:#F5F2ED;
    --ok:#5A7A5A; --danger:#C0392B; --line:rgba(45,45,45,.12);
    font-family:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
    color:var(--ink); background:#F5F2ED; margin:0;
}
.dp-auth-body *{box-sizing:border-box}
.dp-auth-body a{text-decoration:none}

/* ══════════════ Split-Shell ══════════════ */
.dp-auth-body .auth{display:flex; min-height:100vh; width:100%}

/* ── Linkes Marken-Panel: Rotating Showcase ──────────────── */
.dp-auth-body .auth-brand{
    position:relative; flex:1 1 52%; max-width:52%; min-height:100vh; overflow:hidden; color:#fff;
    background:linear-gradient(150deg,#332e29,#1d1b18);}
.dp-auth-body .auth-brandmark{position:absolute; top:40px; left:56px; z-index:4; font-size:24px; font-weight:800; letter-spacing:-.02em; line-height:1; color:#fff}
.dp-auth-body .auth-brandmark .brand{color:var(--gold)}

/* Slides (Cross-Fade) */
.dp-auth-body .auth-slides{position:absolute; inset:0; z-index:1}
/* Slide = isoliertes iframe-Dokument (im Admin gestaltet). Cross-Fade über opacity. */
.dp-auth-body .auth-slide{position:absolute; inset:0; width:100%; height:100%; border:0; display:block;
    opacity:0; transition:opacity 1s ease; background:#211f1c; pointer-events:none}
.dp-auth-body .auth-slide.on{opacity:1; pointer-events:auto}

/* Dots */
.dp-auth-body .auth-dots{position:absolute; bottom:44px; right:56px; z-index:4; display:flex; gap:8px}
.dp-auth-body .auth-dot{width:9px; height:9px; border-radius:50%; background:rgba(255,255,255,.4); cursor:pointer; transition:.25s}
.dp-auth-body .auth-dot.on{background:#fff; width:26px; border-radius:6px}

/* Footer */
.dp-auth-body .auth-brand-foot{position:absolute; bottom:42px; left:56px; z-index:4; display:flex; align-items:center; gap:18px; font-size:12px; color:rgba(255,255,255,.5)}
.dp-auth-body .auth-brand-links{display:flex; gap:14px}
.dp-auth-body .auth-brand-links a{color:rgba(255,255,255,.5); font-weight:500}
.dp-auth-body .auth-brand-links a:hover{color:#fff}

/* ── Rechtes Formular-Panel ──────────────────────────────── */
.dp-auth-body .auth-panel{flex:1 1 48%; max-width:48%; display:flex; align-items:center; justify-content:center;
    padding:40px 24px; overflow-y:auto}
.dp-auth-body .auth-card{width:100%; max-width:390px}

/* Mobile-Logo = Wortmarke (nur wenn Brand-Panel ausgeblendet) */
.dp-auth-body .auth-mobilelogo{display:none; margin-bottom:24px}
.dp-auth-body .auth-mobilelogo .dp-logo{font-size:26px; font-weight:800; letter-spacing:-.02em; color:var(--ink)}
.dp-auth-body .auth-mobilelogo .dp-logo .brand{color:var(--gold)}

/* Kopf */
.dp-auth-body .auth-head{margin-bottom:26px}
.dp-auth-body .auth-title{font-size:26px; font-weight:800; letter-spacing:-.02em; color:var(--ink); margin:0 0 6px}
.dp-auth-body .auth-sub{font-size:14px; color:#6b6b6b; margin:0}
.dp-auth-body .auth-sub a{color:var(--gold-deep); font-weight:700}
.dp-auth-body .auth-sub a:hover{text-decoration:underline}

/* OAuth-Buttons */
.dp-auth-body .auth-oauth{display:flex; flex-direction:column; gap:10px}
.dp-auth-body .auth-oauthbtn,
.dp-auth-body #custom-google-btn,
.dp-auth-body #custom-apple-btn{
    display:flex !important; align-items:center; justify-content:center; gap:10px; width:100%;
    height:46px; padding:0 16px !important; border-radius:12px !important; cursor:pointer;
    border:1.5px solid var(--line) !important; background:#fff !important;
    font-family:inherit; font-size:14px !important; font-weight:600 !important; color:#3a3733 !important;
    box-shadow:0 1px 2px rgba(45,45,45,.05) !important; transition:background .15s, border-color .15s, box-shadow .15s;}
.dp-auth-body #custom-google-btn:hover,
.dp-auth-body #custom-apple-btn:hover{background:#faf8f4 !important; border-color:rgba(193,122,47,.4) !important; box-shadow:0 4px 12px rgba(45,45,45,.08) !important}
.dp-auth-body #custom-google-btn img,
.dp-auth-body #custom-apple-btn img{width:19px !important; height:19px; margin:0 !important}
.dp-auth-body #custom-google-btn span,
.dp-auth-body #custom-apple-btn span{margin:0 !important; flex:none}

/* Trenner */
.dp-auth-body .auth-divider{display:flex; align-items:center; gap:14px; margin:20px 0; color:#a29a8d; font-size:12px; font-weight:600}
.dp-auth-body .auth-divider::before,
.dp-auth-body .auth-divider::after{content:""; height:1px; flex:1; background:var(--line)}

/* Felder */
.dp-auth-body .auth-field{margin-bottom:14px}
.dp-auth-body .auth-field-row{display:flex; gap:12px}
.dp-auth-body .auth-field-row > *{flex:1}
.dp-auth-body .auth-label{display:block; font-size:12.5px; font-weight:700; color:#4d4842; margin-bottom:6px}
.dp-auth-body .form-control,
.dp-auth-body .form-control-lg,
.dp-auth-body .form-control-alt,
.dp-auth-body .auth-input{
    width:100%; height:46px; font-family:inherit; font-size:14.5px; color:var(--ink) !important;
    background:#fff !important; border:1.5px solid var(--line) !important; border-radius:12px !important;
    padding:0 14px !important; box-shadow:none !important; transition:border-color .15s, box-shadow .15s;}
.dp-auth-body textarea.form-control{height:auto; padding:12px 14px !important}
.dp-auth-body .form-control::placeholder{color:#b3ada3 !important}
.dp-auth-body .form-control:focus{border-color:var(--gold) !important; box-shadow:0 0 0 3px rgba(193,122,47,.16) !important; outline:none}
.dp-auth-body .form-control.is-invalid{border-color:var(--danger) !important; box-shadow:0 0 0 3px rgba(192,57,43,.12) !important}

/* Passwortfeld + Auge */
.dp-auth-body .auth-pwd{position:relative}
.dp-auth-body .auth-pwd .form-control{padding-right:46px !important}
.dp-auth-body #show-password-toggle,
.dp-auth-body #show-password-toggle2,
.dp-auth-body #email_check{position:absolute; top:0; right:0; height:46px; width:44px; display:flex; align-items:center; justify-content:center; color:#8a8378; cursor:pointer; z-index:5}
.dp-auth-body #show-password-toggle i,
.dp-auth-body #show-password-toggle2 i{opacity:1 !important}
.dp-auth-body #show-password-toggle:hover i,
.dp-auth-body #show-password-toggle2:hover i{color:var(--gold-deep)}

/* Checkbox / Legal */
.dp-auth-body .auth-check{display:flex; align-items:flex-start; gap:9px; margin:4px 0 16px; font-size:12.5px; color:#6b6b6b; line-height:1.45}
.dp-auth-body .auth-check .form-check-input{width:18px; height:18px; margin:1px 0 0; flex:none; border:1.5px solid var(--line); border-radius:5px}
.dp-auth-body .form-check-input:checked{background-color:var(--gold) !important; border-color:var(--gold) !important}
.dp-auth-body .form-check-input:focus{border-color:var(--gold) !important; box-shadow:0 0 0 3px rgba(193,122,47,.16) !important}
.dp-auth-body .auth-check a,
.dp-auth-body .auth-legal a{color:var(--gold-deep); font-weight:600}
.dp-auth-body .auth-legal{font-size:11px; line-height:1.4; color:#a29a8d; text-align:center; margin:12px 0 0}

/* Fehler / Info */
.dp-auth-body .auth-error,
.dp-auth-body #lbl_info,
.dp-auth-body #lbl_info_send_again{color:var(--danger); font-size:13px; font-weight:600; margin:2px 0 12px; min-height:0}
.dp-auth-body #lbl_info:empty,
.dp-auth-body #lbl_info_send_again:empty{margin:0}
.dp-auth-body #lbl_info .text-muted{color:#8a8378 !important; font-weight:500}

/* Aktionen */
.dp-auth-body .auth-row{display:flex; align-items:center; justify-content:space-between; gap:12px; margin:2px 0 18px}
.dp-auth-body .auth-forgot{font-size:13px; font-weight:600; color:#6b6b6b}
.dp-auth-body .auth-forgot:hover{color:var(--gold-deep)}

.dp-auth-body .btn-primary,
.dp-auth-body .btn-success,
.dp-auth-body .auth-submit{
    display:flex; align-items:center; justify-content:center; gap:8px; width:100%; height:48px;
    color:#fff !important; border:none !important; border-radius:12px !important;
    background:linear-gradient(135deg,var(--gold),var(--gold-deep)) !important;
    box-shadow:0 10px 24px rgba(193,122,47,.34) !important;
    font-family:inherit; font-size:15px; font-weight:700; letter-spacing:.01em; cursor:pointer;
    transition:filter .15s, box-shadow .15s, transform .05s;}
.dp-auth-body .btn-primary:hover,
.dp-auth-body .btn-success:hover,
.dp-auth-body .auth-submit:hover{filter:brightness(1.06); box-shadow:0 12px 30px rgba(193,122,47,.44) !important}
.dp-auth-body .btn-primary:active,
.dp-auth-body .auth-submit:active{transform:translateY(1px)}
.dp-auth-body .btn-primary:disabled,
.dp-auth-body .btn-success:disabled,
.dp-auth-body .auth-submit:disabled,
.dp-auth-body .auth-submit.disabled,
.dp-auth-body .btn-primary.disabled,
.dp-auth-body .btn-success.disabled{opacity:.6; box-shadow:none !important; filter:none; pointer-events:none; cursor:default}
.dp-auth-body .btn.rounded-pill{border-radius:12px !important}   /* Pillen zu Karten-Radius vereinheitlichen */

/* „Noch kein Konto"-Zeile */
.dp-auth-body .auth-alt{text-align:center; font-size:13.5px; color:#6b6b6b; margin-top:20px}
.dp-auth-body .auth-alt a{color:var(--gold-deep); font-weight:700}
.dp-auth-body .auth-alt a:hover{text-decoration:underline}

/* Spinner / Statusmeldungen (OAuth-Wartescreens) */
.dp-auth-body .spinner-border.text-warning{color:var(--gold) !important}
.dp-auth-body .text-primary{color:var(--gold-deep) !important}
.dp-auth-body .auth-wait{text-align:center; padding:20px 0}
.dp-auth-body .auth-wait img{height:30px; margin-bottom:14px}
.dp-auth-body .auth-wait p{margin:0 0 6px}

/* ── Shop-Auswahl nach Login (#select_block / #ShopTable) ── */
.dp-auth-body #select_block .card{border:none !important; border-radius:0 !important; box-shadow:none !important; background:transparent !important}
.dp-auth-body #select_block .card-header{background:transparent !important; color:var(--ink) !important; padding:0 0 6px !important; border:none !important; justify-content:flex-start !important}
.dp-auth-body #select_block .card-header h4{font-size:20px; font-weight:800; letter-spacing:-.02em; color:var(--ink)}
.dp-auth-body #select_block .card-body{padding:0 !important}
.dp-auth-body #ShopTable{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; max-height:60vh; overflow-y:auto}
.dp-auth-body #ShopTable li > a.block{
    display:flex !important; align-items:center; border:1.5px solid var(--line) !important; border-radius:13px !important; background:#fff !important;
    margin:0 !important; padding:12px 14px !important; box-shadow:none !important; transition:border-color .15s, background .15s, box-shadow .15s;}
.dp-auth-body #ShopTable li > a.block:hover{border-color:var(--gold) !important; background:#faf8f4 !important; box-shadow:0 6px 16px rgba(193,122,47,.14) !important}
.dp-auth-body #ShopTable .si-login{color:var(--gold-deep) !important}

/* ── Auswahlkarten (Login/Select: Account bestehend/neu) ── */
.dp-auth-body .auth-choices{display:flex; flex-direction:column; gap:12px}
.dp-auth-body .auth-choice{display:flex; align-items:center; gap:14px; padding:16px; border:1.5px solid var(--line); border-radius:15px; background:#fff;
    cursor:pointer; text-align:left; transition:border-color .15s, box-shadow .15s, transform .12s}
.dp-auth-body .auth-choice:hover{border-color:var(--gold); box-shadow:0 10px 24px rgba(193,122,47,.14); transform:translateY(-2px)}
.dp-auth-body .auth-choice-ic{flex:none; width:48px; height:48px; border-radius:13px; display:grid; place-items:center; font-size:19px; color:#fff;
    background:linear-gradient(140deg,var(--gold),var(--gold-deep)); box-shadow:0 8px 18px rgba(193,122,47,.35)}
.dp-auth-body .auth-choice-ic.is-dark{background:linear-gradient(140deg,#3a3632,#211f1c); box-shadow:0 8px 18px rgba(45,45,45,.28)}
.dp-auth-body .auth-choice-tx{flex:1; min-width:0}
.dp-auth-body .auth-choice-tx b{display:block; font-size:14.5px; font-weight:700; color:var(--ink)}
.dp-auth-body .auth-choice-tx small{font-size:12.5px; color:#6b6b6b; line-height:1.4}
.dp-auth-body .auth-choice-arrow{color:#c3bbae; font-size:15px}
.dp-auth-body .auth-choice:hover .auth-choice-arrow{color:var(--gold-deep)}

/* ── Ergebnis-/Icon-Blocks (Passwort geändert, Link ungültig) ── */
.dp-auth-body .auth-status-ic{width:64px; height:64px; margin-bottom:20px; border-radius:18px; display:grid; place-items:center; font-size:26px}
.dp-auth-body .auth-status-ic.is-ok{color:var(--ok); background:rgba(90,122,90,.12)}
.dp-auth-body .auth-status-ic.is-warn{color:var(--gold-deep); background:rgba(193,122,47,.12)}
.dp-auth-body .auth-note{font-size:13.5px; color:#6b6b6b; line-height:1.55; margin:0 0 20px}
.dp-auth-body .auth-note b{color:var(--ink)}

/* Alte OneUI-Blockreste (falls noch im Markup) neutralisieren */
.dp-auth-body .block.block-rounded{border:none !important; box-shadow:none !important; background:transparent !important}
.dp-auth-body .block-header.block-header-default{background:transparent !important; border:none !important; padding:0 0 6px !important; min-height:0}
.dp-auth-body .block-header .block-title{color:var(--ink) !important; font-size:20px; font-weight:800; letter-spacing:-.02em}
.dp-auth-body .block-content{padding:0 !important}

/* ── Responsive: Brand-Panel unter 992px ausblenden ── */
@media (max-width:991.98px){
    .dp-auth-body .auth{flex-direction:column}
    .dp-auth-body .auth-brand{display:none}
    .dp-auth-body .auth-panel{max-width:100%; min-height:100vh}
    .dp-auth-body .auth-mobilelogo{display:block}
}