/* kaman_b2b_switch – neutrale Grundgestaltung, über CSS-Variablen an jedes Template anpassbar */
/* Anpassbar per CSS-Variablen im Template, z. B. :root { --kb2b-accent: #950d14; } */
.kb2b {
    display: flex;
    align-items: center;
    gap: .625rem;
    font-size: .8125rem;
    line-height: 1;
    white-space: nowrap;
    color: var(--kb2b-ink, #15171a);
}
.kb2b-label { color: var(--kb2b-muted, #6b727a); font-weight: 500; }
.kb2b-seg {
    display: inline-flex;
    padding: 2px;
    background: var(--kb2b-bg, #ffffff);
    border: 1px solid var(--kb2b-line, #c5cad0);
    border-radius: 3px;
}
.kb2b-opt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.625rem;
    padding: 0 .75rem;
    font-weight: 600;
    color: var(--kb2b-ink, #15171a);
    text-decoration: none;
    border-radius: 2px;
    transition: background-color .15s ease, color .15s ease;
}
/* Farben mit !important: Templates färben Links in Kopfzeilen oft per ID-Selektor (z. B. weiß) */
.kb2b .kb2b-opt { color: var(--kb2b-ink, #15171a) !important; background: transparent !important; }
.kb2b .kb2b-opt:hover, .kb2b .kb2b-opt:focus { color: var(--kb2b-ink, #15171a) !important; text-decoration: none; background: rgba(21, 23, 26, .07) !important; }
.kb2b .kb2b-opt.is-active, .kb2b .kb2b-opt.is-active:hover, .kb2b .kb2b-opt.is-active:focus { color: var(--kb2b-accent-text, #ffffff) !important; background: var(--kb2b-accent, #15171a) !important; }
.kb2b-note { color: var(--kb2b-muted, #6b727a); font-weight: 500; }
.kb2b-badge {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: .375rem .625rem;
    font-weight: 700;
    color: #fff;
    background: var(--kb2b-dealer, #1e7b4e);
    border-radius: 3px;
}
.kb2b-badge svg { width: .875rem; height: .875rem; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }

.kb2b--mobile { display: none; }
@media (max-width: 991.98px) {
    .kb2b--desktop { display: none; }
    .kb2b--mobile { display: flex; justify-content: flex-start; gap: .75rem; width: 100%; padding-top: .5rem; }
    .kb2b--mobile .kb2b-note { margin-left: auto; }
    .kb2b--mobile .kb2b-opt { min-height: 2.5rem; padding: 0 1rem; font-size: .875rem; }
}
@media (max-width: 359.98px) {
    .kb2b--mobile .kb2b-label { display: none; }
}

.kb2b-cta {
    background: var(--kb2b-cta-bg, #f3f4f6);
    border-bottom: 1px solid rgba(21, 23, 26, .08);
}
.kb2b-cta-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem 1.5rem;
    max-width: var(--kb2b-container, 1400px);
    margin: 0 auto;
    padding: .875rem 1rem;
    border-left: 4px solid var(--kb2b-cta-accent, #15171a);
}
.kb2b-cta-text { font-weight: 600; color: var(--kb2b-ink, #15171a); }
.kb2b-cta-btn {
    display: inline-flex;
    align-items: center;
    min-height: 2.75rem;
    padding: 0 1.125rem;
    font-weight: 600;
    color: var(--kb2b-accent-text, #ffffff);
    background: var(--kb2b-cta-accent, #15171a);
    border-radius: 2px;
    text-decoration: none;
    white-space: nowrap;
}
.kb2b-cta-btn:hover, .kb2b-cta-btn:focus { color: var(--kb2b-accent-text, #ffffff); text-decoration: none; opacity: .9; }
@media (max-width: 575.98px) {
    .kb2b-cta-btn { width: 100%; justify-content: center; }
}

/* --- Seite „Händler werden“ --------------------------------------------------- */
.kb2b-page { max-width: var(--kb2b-container, 1400px); margin: 0 auto; padding: 1.5rem 0 3rem; }
.kb2b-page-head { max-width: 46rem; margin-bottom: 2rem; }
.kb2b-page-title { margin: 0 0 .75rem; }
.kb2b-page-lead { font-size: 1.0625rem; color: var(--kb2b-muted, #6b727a); margin: 0; }
.kb2b-page-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 2.5rem; align-items: start; }
.kb2b-panel { padding: 1.5rem; background: var(--kb2b-cta-bg, #f3f4f6); border-left: 4px solid var(--kb2b-cta-accent, #15171a); }
.kb2b-panel--ok { border-left-color: var(--kb2b-dealer, #1e7b4e); }
.kb2b-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; margin-top: 1rem; }
.kb2b-form { padding: 1.75rem; background: var(--kb2b-bg, #fff); border: 1px solid var(--kb2b-line, #c5cad0); }
.kb2b-form-title { margin: 0 0 1.25rem; font-size: 1.375rem; }
.kb2b-form .kb2b-file { height: auto; padding: .5rem; }
.kb2b-steps { counter-reset: none; list-style: none; margin: 0 0 1.5rem; padding: 0; border: 1px solid var(--kb2b-line, #c5cad0); }
.kb2b-steps li { display: flex; align-items: center; gap: .875rem; padding: 1rem 1.125rem; color: var(--kb2b-muted, #6b727a); font-weight: 500; }
.kb2b-steps li + li { border-top: 1px solid var(--kb2b-line, #c5cad0); }
.kb2b-steps li span { flex: 0 0 2rem; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; font-weight: 700; border: 1.5px solid currentColor; }
.kb2b-steps li.is-current { color: var(--kb2b-ink, #15171a); }
.kb2b-steps li.is-current span { color: var(--kb2b-accent-text, #fff); background: var(--kb2b-cta-accent, #15171a); border-color: var(--kb2b-cta-accent, #15171a); }
.kb2b-steps li.is-done { color: var(--kb2b-ink, #15171a); }
.kb2b-steps li.is-done span { color: #fff; background: var(--kb2b-dealer, #1e7b4e); border-color: var(--kb2b-dealer, #1e7b4e); }
.kb2b-benefits { list-style: none; margin: 0; padding: 0; }
.kb2b-benefits li { position: relative; padding: .375rem 0 .375rem 1.75rem; font-weight: 500; color: var(--kb2b-ink, #15171a); }
.kb2b-benefits li::before { content: ''; position: absolute; left: .25rem; top: .75rem; width: .75rem; height: .4rem; border: solid var(--kb2b-dealer, #1e7b4e); border-width: 0 0 2px 2px; transform: rotate(-45deg); }
@media (max-width: 991.98px) {
    .kb2b-page-grid { grid-template-columns: 1fr; gap: 1.5rem; }
    .kb2b-form { padding: 1.125rem; }
}

/* Händler-Registrierung: JTL-Kundenformular im Plugin-Layout */
.kb2b-register { padding: 1.75rem; background: var(--kb2b-bg, #fff); border: 1px solid var(--kb2b-line, #c5cad0); }
.kb2b-register-head { margin-bottom: .25rem; }
.kb2b-login-hint { margin: 0; color: var(--kb2b-muted, #6b727a); }
.kb2b-login-hint a { font-weight: 600; }
/* JTL-Abschnitte (Name, Adresse, Kontakt, Passwort, Gewerbenachweis) untereinander statt 4/8-Spalten */
.kb2b-register fieldset > .row > [class*="col-md-"],
.kb2b-register .register-form-account > [class*="col-md-"] { flex: 0 0 100%; max-width: 100%; }
.kb2b-register fieldset { min-width: 0; }
.kb2b-register .h3 { margin: 0 0 .875rem; font-size: 1.0625rem; }
.kb2b-register hr { margin: 1.25rem 0; }
.kb2b-register .required-info { font-size: .8125rem; color: var(--kb2b-muted, #6b727a); }
.kb2b-register .direct-advertising small { display: block; margin-top: -.25rem; font-size: .75rem; line-height: 1.45; color: var(--kb2b-muted, #6b727a); }
.kb2b-label-static { display: block; margin-bottom: .375rem; font-weight: 600; color: var(--kb2b-ink, #15171a); }
.kb2b-register .kb2b-file { height: auto; padding: .5rem; }
.kb2b-register .kb2b-file-group .form-error-msg, .kb2b-register .kb2b-privacy-group .form-error-msg { margin-top: .375rem; }
.kb2b-register-submit { margin-top: 1.25rem; }
/* Login für bestehende Kunden */
.kb2b-login { margin-bottom: 1.5rem; padding: 1.5rem; background: var(--kb2b-cta-bg, #f3f4f6); border: 1px solid var(--kb2b-line, #c5cad0); scroll-margin-top: 12rem; }
.kb2b-login-title { margin: 0 0 .375rem; font-size: 1.25rem; }
.kb2b-login-text { margin: 0 0 1rem; color: var(--kb2b-muted, #6b727a); }
.kb2b-login .form-group { margin-bottom: .875rem; }
.kb2b-login-forgot { display: inline-block; margin-top: .75rem; font-size: .875rem; }
@media (max-width: 991.98px) {
    .kb2b-register { padding: 1.125rem; }
    .kb2b-login { padding: 1.125rem; }
}
.kb2b-register-head .kb2b-form-title { margin-bottom: .375rem; }
.kb2b-register .kb2b-privacy-group .custom-control-label { white-space: normal; overflow: visible; text-overflow: clip; font-size: .875rem; line-height: 1.5; }