/* IKUNIX customer account flow · v1.27 */
.account-flow-body{padding-block:34px}
.account-register-card{width:min(100%,780px)}
.account-step{display:inline-flex;align-items:center;justify-content:center;margin-bottom:8px;padding:5px 10px;border:1px solid #cfe3fb;border-radius:999px;background:#f3f9ff;color:#075fc6;font-size:.72rem;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
.account-type-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 20px;padding:5px;border:1px solid var(--border);border-radius:13px;background:#f7faff}
.account-type-option{display:block!important;margin:0!important;cursor:pointer}
.account-type-option input{position:absolute;opacity:0;pointer-events:none}
.account-type-option span{display:flex;align-items:center;justify-content:center;min-height:42px;padding:8px 12px;border-radius:9px;color:#526176;font-weight:800;transition:.16s ease}
.account-type-option.is-active span{background:linear-gradient(135deg,#1677ff,#039cfd);color:#fff;box-shadow:0 7px 18px rgba(22,119,255,.19)}
.account-form-section{margin:0 0 16px;padding:17px;border:1px solid var(--border);border-radius:14px;background:#fff}
.account-form-section[hidden]{display:none!important}
.account-section-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 14px;padding:0 0 10px;border-bottom:1px solid #edf3f8}
.account-section-title strong{font-size:.98rem}
.account-section-title small{font-size:.76rem;text-align:right}
.account-register-card .form-grid{gap:10px 14px}
.account-register-card label{margin-bottom:8px}
.field-label{display:inline-flex;align-items:baseline;gap:3px;width:max-content;max-width:100%;white-space:nowrap}
.required-mark,.required-business{display:inline;color:#b42318;line-height:1;white-space:nowrap}
.account-check{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:10px!important;margin:0 0 12px!important;font-weight:650!important;line-height:1.5}
.account-check input{width:18px!important;height:18px!important;min-height:18px!important;flex:0 0 auto;margin:2px 0 0!important;accent-color:var(--primary)}
.account-check a{font-weight:800;text-decoration:underline;text-underline-offset:2px}
.account-legal-note{margin:10px 0 0;padding:12px 14px;border-left:3px solid #1677ff;border-radius:0 10px 10px 0;background:#f4f9ff;color:#607086;font-size:.79rem;line-height:1.55}
.account-primary-action{min-height:46px;font-size:.95rem!important}
.account-bottom-actions .admin-btn.secondary{background:#fff;color:#075fc6;border-color:var(--border-strong)}

/* Same visual bot puzzle as the frontend contact form, fitted to the account card. */
.shape-puzzle{margin:0;padding:18px;border:1px solid #dce9f8;border-radius:18px;background:linear-gradient(145deg,#f8fbff,#f3f1ff)}
.shape-puzzle-head{display:flex;align-items:center;gap:12px}
.shape-puzzle-head strong{display:block;font-size:.95rem}.shape-puzzle-head p{margin:2px 0 0;color:var(--muted);font-size:.82rem}
.shape-puzzle-shield{width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;border-radius:12px;color:#fff;background:linear-gradient(135deg,#1677ff,#039cfd);font-weight:900}
.shape-puzzle-target{display:flex;align-items:center;gap:10px;margin:14px 0 12px;padding:11px 13px;border:1px dashed #b9d8fb;border-radius:14px;background:#fff}
.shape-puzzle-target>span{color:var(--muted);font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.shape-puzzle-target>strong{margin-left:auto;font-size:1.45rem;color:#3253f7}.shape-puzzle-target small{min-width:72px;color:#344054;font-weight:800}
.shape-puzzle-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.shape-choice{min-height:68px;display:grid;place-items:center;gap:2px;padding:9px;border:1px solid #d5e4f5;border-radius:14px;background:#fff;color:#344054;cursor:pointer;transition:.16s ease}
.shape-choice>span{font-size:1.45rem}.shape-choice small{font-weight:800}.shape-choice:hover{transform:translateY(-2px);border-color:#1677ff;box-shadow:0 9px 18px rgba(13,134,253,.12)}
.shape-choice.is-selected{border-color:#3253f7;background:linear-gradient(145deg,#eef9ff,#f0edff);box-shadow:0 0 0 3px rgba(50,83,247,.12)}
.puzzle-note{display:block;margin-top:9px;color:var(--muted);font-size:.78rem;font-weight:700}.shape-puzzle.has-selection .puzzle-note{color:#07835b}

/* Full-screen transition loader with blue gradient pearls. */
.account-loader{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:24px;background:rgba(244,248,252,.94);backdrop-filter:blur(12px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease}
.account-loader.is-visible{opacity:1;visibility:visible;pointer-events:auto}
.account-loader-card{display:grid;place-items:center;width:min(92vw,360px);padding:30px 26px;border:1px solid #d8e7f6;border-radius:24px;background:#fff;box-shadow:0 24px 70px rgba(26,76,125,.16);text-align:center}
.account-loader-logo{height:78px;display:grid;place-items:center;margin-bottom:2px}.account-loader-logo .admin-logo{width:150px;height:78px;object-fit:contain}
.account-loader-orbit{position:relative;width:116px;height:116px;margin:4px 0 18px;animation:accountOrbit 2.5s linear infinite}
.account-loader-orbit span{position:absolute;left:50%;top:50%;width:13px;height:13px;margin:-6.5px;border-radius:50%;transform:rotate(calc(var(--i)*30deg)) translateY(-46px);background:linear-gradient(135deg,#74c9ff,#1677ff 58%,#3253f7);box-shadow:0 5px 13px rgba(22,119,255,.23);animation:accountPearl 1.3s ease-in-out infinite;animation-delay:calc(var(--i)*-.07s)}
.account-loader-card strong{font-size:1.04rem}.account-loader-card small{margin-top:5px;color:var(--muted)}
@keyframes accountOrbit{to{transform:rotate(360deg)}}
@keyframes accountPearl{0%,100%{opacity:.35;scale:.76}50%{opacity:1;scale:1.15}}
@media(prefers-reduced-motion:reduce){.account-loader-orbit,.account-loader-orbit span{animation:none}}

/* Waiting screen and animated CSS panda. */
.account-wait-card,.account-activation-card{width:min(100%,560px);text-align:center}
.account-wait-copy{margin:18px 0 20px;padding:16px;border:1px solid #d7e8fb;border-radius:14px;background:#f4f9ff;text-align:left}
.account-wait-copy strong{display:block;margin-bottom:6px;color:#0a315f}.account-wait-copy p{margin:0 0 8px;color:#526176;line-height:1.55}.account-wait-copy small{display:block}
.panda-scene{position:relative;width:260px;height:205px;margin:10px auto 6px}
.panda{position:absolute;left:50%;top:24px;width:126px;height:150px;transform:translateX(-50%)}
.panda-head{position:absolute;left:18px;top:11px;width:90px;height:82px;border:3px solid #0b2747;border-radius:47% 47% 45% 45%;background:#fff;z-index:3}
.panda-ear{position:absolute;top:3px;width:32px;height:32px;border-radius:50%;background:#0b2747;z-index:1}.panda-ear.left{left:13px}.panda-ear.right{right:13px}
.panda-eye{position:absolute;top:39px;width:24px;height:29px;border-radius:55% 45% 55% 45%;background:#0b2747;z-index:4;animation:pandaBlink 4s infinite}.panda-eye.left{left:31px;transform:rotate(16deg)}.panda-eye.right{right:31px;transform:rotate(-16deg)}
.panda-eye::after{content:"";position:absolute;width:7px;height:8px;left:9px;top:8px;border-radius:50%;background:#fff}
.panda-nose{position:absolute;left:58px;top:66px;width:11px;height:8px;border-radius:50%;background:#0b2747;z-index:5}
.panda-body{position:absolute;left:26px;top:79px;width:74px;height:68px;border-radius:42% 42% 38% 38%;background:#0b2747;z-index:2}
.panda-paw{position:absolute;top:105px;width:35px;height:22px;border-radius:50%;background:#0b2747;z-index:7;animation:pandaType .72s ease-in-out infinite alternate}.panda-paw.left{left:17px;transform:rotate(15deg)}.panda-paw.right{right:17px;transform:rotate(-15deg);animation-delay:.18s}
.panda-desk{position:absolute;left:18px;right:18px;bottom:18px;height:14px;border-radius:9px;background:linear-gradient(90deg,#0b2747,#1677ff,#039cfd);box-shadow:0 10px 20px rgba(22,119,255,.17);z-index:5}
.panda-laptop{position:absolute;left:50%;bottom:10px;width:104px;height:62px;transform:translateX(-50%);border:3px solid #0b2747;border-radius:8px 8px 4px 4px;background:linear-gradient(145deg,#dff3ff,#eef3ff);z-index:6;display:grid;place-items:center;overflow:hidden}.panda-laptop img{display:block;width:46px;height:auto;max-height:34px;object-fit:contain}
.panda-dot{position:absolute;width:9px;height:9px;border-radius:50%;background:linear-gradient(135deg,#6fc9ff,#3253f7);animation:pandaDot 1.3s ease-in-out infinite}.dot-a{left:26px;top:78px}.dot-b{right:28px;top:48px;animation-delay:.28s}.dot-c{right:44px;top:108px;animation-delay:.55s}
@keyframes pandaBlink{0%,44%,48%,100%{scale:1 1}46%{scale:1 .12}}
@keyframes pandaType{to{translate:0 5px}}
@keyframes pandaDot{0%,100%{opacity:.2;transform:translateY(4px)}50%{opacity:1;transform:translateY(-7px)}}

.account-result-icon{display:grid;place-items:center;width:70px;height:70px;margin:0 auto 15px;border-radius:50%;background:linear-gradient(135deg,#07835b,#20b97c);color:#fff;font-size:2rem;font-weight:900;box-shadow:0 12px 28px rgba(7,131,91,.2)}
.account-result-icon.is-error{background:linear-gradient(135deg,#b42318,#ef5b4f);box-shadow:0 12px 28px rgba(180,35,24,.18)}
.account-mini-loader{display:flex;justify-content:center;gap:8px;margin:18px 0 10px}.account-mini-loader span{width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,#039cfd,#3253f7);animation:miniPearl .9s ease-in-out infinite}.account-mini-loader span:nth-child(2){animation-delay:.1s}.account-mini-loader span:nth-child(3){animation-delay:.2s}.account-mini-loader span:nth-child(4){animation-delay:.3s}.account-mini-loader span:nth-child(5){animation-delay:.4s}
@keyframes miniPearl{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(-7px);opacity:1}}
.account-redirect-note{margin:0 0 18px;color:var(--muted);font-size:.82rem}

.marketing-choice-card{margin:8px 0 20px;padding:18px;border:1px solid var(--border);border-radius:15px;background:#f9fcff}
.marketing-switch-row{display:flex!important;align-items:center;justify-content:space-between;gap:18px;margin:0!important;text-align:left;cursor:pointer}
.marketing-switch-copy{display:grid;gap:4px}.marketing-switch-copy strong{font-size:.98rem}.marketing-switch-copy small{color:var(--muted);font-weight:550;line-height:1.5}
.toggle-switch{position:relative;display:block;flex:0 0 auto;width:54px;height:30px}.toggle-switch input{position:absolute!important;opacity:0;width:1px!important;height:1px!important}.toggle-switch i{position:absolute;inset:0;border-radius:999px;background:#c8d4df;transition:.18s}.toggle-switch i::after{content:"";position:absolute;left:4px;top:4px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 7px rgba(24,42,65,.2);transition:.18s}.toggle-switch input:checked+i{background:linear-gradient(135deg,#1677ff,#039cfd)}.toggle-switch input:checked+i::after{transform:translateX(24px)}
.account-skip-hint{margin:10px 0 0;color:var(--muted);font-size:.78rem;text-align:center}

.portal-marketing-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px;border:1px solid #dce8f4;border-radius:13px;background:#f9fcff}.portal-marketing-row .marketing-switch-copy{max-width:700px}.marketing-meta{margin-top:10px;color:var(--muted);font-size:.78rem}

@media(max-width:700px){
  .account-flow-body{padding:14px}.account-register-card{padding-inline:18px}.account-type-switch{grid-template-columns:1fr}.account-section-title{align-items:flex-start;flex-direction:column;gap:2px}.account-section-title small{text-align:left}.account-register-card .form-grid{grid-template-columns:1fr}.account-register-card .wide{grid-column:auto}.shape-puzzle-row{grid-template-columns:repeat(3,minmax(0,1fr))}.marketing-switch-row,.portal-marketing-row{align-items:flex-start}.panda-scene{transform:scale(.92);margin-inline:auto}
}


/* v1.27.6: sichtbare Formularvalidierung */
.account-error-summary{margin:0 0 16px;padding:14px 16px;border:1px solid #f3b5b0;border-radius:12px;background:#fff4f3;color:#8f1d18;font-size:14px;line-height:1.5}
.account-error-summary[hidden]{display:none!important}
.account-error-summary strong{display:block;margin-bottom:5px}
.account-error-summary ul{margin:5px 0 0;padding-left:20px}
.field-has-error input:not([type="checkbox"]),.field-has-error select,.field-has-error textarea{border-color:#d92d20!important;box-shadow:0 0 0 3px rgba(217,45,32,.08)!important}
.field-error-message{display:block;width:100%;margin-top:6px;color:#b42318;font-size:12px;font-weight:700;line-height:1.35}
.account-check.field-has-error{color:#b42318}
[data-shape-puzzle].field-has-error{outline:2px solid rgba(217,45,32,.35);outline-offset:4px;border-radius:12px}