/* ==========================================================================
   UDM Wizard Styles
   Moderne Erstellungs-Assistenten fuer Dialoge und Ansichtselemente
   ========================================================================== */

.udm-wizard {
    width: 100%;
    max-width: 48em;
    min-height: 32em;
    margin: 0 auto;
    padding: 1.5em 2em 1em;
    display: flex;
    flex-direction: column;
}


/* ==========================================================================
   Horizontal Stepper
   ========================================================================== */

.udm-wizard-stepper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding: 0.5em 0 0.15em;
}

.udm-wizard-step-dot {
    width: 2em;
    height: 2em;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85em;
    color: var(--bs-gray-500);
    background: var(--bs-gray-200);
    border: 2px solid var(--bs-gray-300);
    flex-shrink: 0;
    transition: all 0.25s ease;
}

.udm-wizard-step-dot.active {
    background: var(--bs-primary);
    border-color: var(--bs-primary);
    color: #fff;
    box-shadow: 0 0 0 4px rgba(var(--bs-primary-rgb), 0.15);
}

.udm-wizard-step-dot.done {
    background: var(--bs-success);
    border-color: var(--bs-success);
    color: #fff;
}

.udm-wizard-step-line {
    width: 5em;
    height: 2px;
    background: var(--bs-gray-300);
    transition: background 0.25s ease;
}

.udm-wizard-step-line.done {
    background: var(--bs-success);
}

.udm-wizard-step-labels {
    display: flex;
    justify-content: center;
    gap: 4em;
    font-size: 0.8em;
    color: var(--bs-gray-500);
    padding-bottom: 1.25em;
    letter-spacing: 0.02em;
}

.udm-wizard-step-labels span.active {
    color: var(--bs-primary);
    font-weight: 700;
}

.udm-wizard-step-labels span.done {
    color: var(--bs-success);
    font-weight: 600;
}


/* ==========================================================================
   Type Cards Grid
   ========================================================================== */

.udm-wizard-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.6em;
    padding: 0.25em 0;
}

/* Dialog-Wizard: nur 3 Karten → 3 Spalten */
.udm-wizard-cards--cols-3 {
    grid-template-columns: repeat(3, 1fr);
}

.udm-wizard-card {
    border: 1px solid var(--bs-gray-200);
    border-radius: 0.625em;
    padding: 0.85em 0.5em 0.7em;
    cursor: pointer;
    text-align: center;
    background: var(--bs-body-bg);
    transition: all 0.2s ease;
    position: relative;
}

.udm-wizard-card:hover {
    border-color: rgba(var(--bs-primary-rgb), 0.4);
    box-shadow: 0 4px 12px rgba(var(--bs-primary-rgb), 0.1);
    transform: translateY(-2px);
}

.udm-wizard-card--selected {
    border-color: var(--bs-primary);
    border-width: 2px;
    padding: calc(0.85em - 1px) calc(0.5em - 1px) calc(0.7em - 1px);
    background: rgba(var(--bs-primary-rgb), 0.04);
    box-shadow: 0 4px 16px rgba(var(--bs-primary-rgb), 0.15);
}

.udm-wizard-card--selected .udm-wizard-card-icon {
    color: var(--bs-primary);
}

.udm-wizard-card--selected .udm-wizard-card-title {
    color: var(--bs-primary);
}


/* ==========================================================================
   Card Elements
   ========================================================================== */

.udm-wizard-card-icon {
    font-size: 1.6em;
    color: var(--bs-gray-500);
    margin-bottom: 0.25em;
    display: block;
    transition: color 0.2s ease;
}

.udm-wizard-card:hover .udm-wizard-card-icon {
    color: var(--bs-primary);
}

.udm-wizard-card-title {
    font-weight: 700;
    font-size: 0.85em;
    margin-bottom: 0.15em;
    color: var(--bs-body-color);
    transition: color 0.2s ease;
}

.udm-wizard-card-desc {
    font-size: 0.72em;
    color: var(--bs-gray-500);
    line-height: 1.35;
}


/* ==========================================================================
   Form Section (Datengrundlage / Grunddaten)
   ========================================================================== */

.udm-wizard-section {
    margin-top: 1em;
}

.udm-wizard-section-title {
    font-size: 0.85em;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--bs-gray-500);
    margin-bottom: 0.75em;
    padding-bottom: 0.4em;
    border-bottom: 1px solid var(--bs-gray-200);
}

.udm-wizard-fields {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1em;
}

.udm-wizard-field {
    display: flex;
    flex-direction: column;
    gap: 0.3em;
}

.udm-wizard-field-label {
    font-size: 0.9em;
    font-weight: 600;
    color: var(--bs-gray-600);
}

.udm-wizard-field-label--required::after {
    content: " *";
    color: var(--bs-danger);
}


/* ==========================================================================
   Type Badge (Step 2 header)
   ========================================================================== */

.udm-wizard-type-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.4em 1em;
    border-radius: 2em;
    background: rgba(var(--bs-primary-rgb), 0.08);
    color: var(--bs-primary);
    font-weight: 700;
    font-size: 0.85em;
    margin-bottom: 0.5em;
}

.udm-wizard-type-badge i {
    font-size: 1.1em;
}


/* ==========================================================================
   Wizard Footer
   ========================================================================== */

.udm-wizard-footer {
    border-top: 1px solid var(--bs-gray-200);
    padding: 1em 0 0.25em;
    margin-top: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
}

.udm-wizard-footer-progress {
    flex: 1;
    max-width: 10em;
    height: 4px;
    background: var(--bs-gray-200);
    border-radius: 2px;
    overflow: hidden;
}

.udm-wizard-footer-bar {
    height: 100%;
    background: var(--bs-primary);
    border-radius: 2px;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.udm-wizard-footer-actions {
    display: flex;
    gap: 0.5em;
    align-items: center;
}


/* ==========================================================================
   Wizard Buttons
   ========================================================================== */

.udm-wizard-btn {
    padding: 0.5em 1.25em;
    border-radius: 0.4em;
    font-size: 0.85em;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.udm-wizard-btn--primary {
    background: var(--bs-primary);
    color: #fff;
    box-shadow: 0 1px 3px rgba(var(--bs-primary-rgb), 0.3);
}

.udm-wizard-btn--primary:hover:not(:disabled) {
    box-shadow: 0 3px 8px rgba(var(--bs-primary-rgb), 0.35);
    filter: brightness(1.05);
}

.udm-wizard-btn--ghost {
    background: transparent;
    color: var(--bs-gray-500);
}

.udm-wizard-btn--ghost:hover:not(:disabled) {
    color: var(--bs-body-color);
    background: var(--bs-gray-100);
}

.udm-wizard-btn:disabled {
    opacity: 0.4;
    cursor: default;
    box-shadow: none;
}


/* ==========================================================================
   Two-Column Fields
   ========================================================================== */

.udm-wizard-fields--two-col {
    grid-template-columns: 1fr 1fr;
}


/* ==========================================================================
   Checkbox Field List (Versionierungs-Wizard)
   ========================================================================== */

.udm-wizard-field-checks {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.4em 1.5em;
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0.25em 0;
    align-content: start;
}

.udm-wizard-check-item {
    display: flex;
    align-items: flex-start;
    gap: 0.5em;
    padding: 0.35em 0.5em;
    border-radius: 0.35em;
    cursor: pointer;
    transition: background 0.15s ease;
}

.udm-wizard-check-item:hover {
    background: var(--bs-gray-100);
}

.udm-wizard-check-label {
    display: flex;
    flex-direction: column;
    font-size: 0.85em;
    line-height: 1.35;
}

.udm-wizard-check-label strong {
    font-weight: 600;
    color: var(--bs-body-color);
}

.udm-wizard-check-label small {
    font-size: 0.82em;
    color: var(--bs-gray-500);
}


/* ==========================================================================
   Summary (Zusammenfassung)
   ========================================================================== */

.udm-wizard-summary {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    padding: 0.25em 0;
}

.udm-wizard-summary-row {
    display: flex;
    align-items: center;
    gap: 0.75em;
    padding: 0.4em 0.75em;
    background: var(--bs-gray-100);
    border-radius: 0.35em;
    font-size: 0.85em;
}

.udm-wizard-summary-label {
    font-weight: 600;
    color: var(--bs-gray-600);
    min-width: 10em;
    flex-shrink: 0;
}

.udm-wizard-summary-value {
    color: var(--bs-body-color);
}

.udm-wizard-summary-icon {
    color: var(--bs-primary);
    font-size: 1.1em;
    width: 1.5em;
    text-align: center;
    flex-shrink: 0;
}


/* ==========================================================================
   V2 Wizard Styles (neue Komponenten)
   Stepper mit Bottom-Border, Typ-Karten nur Icon+Titel, Sticky Footer
   ========================================================================== */


/* --- V2 Wizard Container (Body scrollt, Footer klebt unten) --- */

.udm-wizard-v2 {
    width: 100%;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.udm-wizard-v2-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 1.25em 2em 1em;
    overflow-y: auto;
    max-width: 52em;
    margin: 0 auto;
    width: 100%;
}

.udm-wizard-v2-body > .udm-wizard-section:has(.udm-wizard-field-checks) {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}


/* --- V2 Stepper (Bottom-Border + Subtitles) --- */

.udm-wizard-stepper-v2 {
    display: flex;
    align-items: stretch;
    background: var(--bs-gray-100);
    border-bottom: 1px solid var(--bs-gray-200);
    padding: 0 1.5em;
    flex-shrink: 0;
}

.udm-wizard-stepper-v2-item {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.6em;
    padding: 0.75em 0.85em;
    position: relative;
    margin-bottom: -1px;
}

.udm-wizard-stepper-v2-item::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--bs-gray-200);
    transition: background 0.3s ease;
}

.udm-wizard-stepper-v2-item.active::after {
    background: var(--bs-primary);
}

.udm-wizard-stepper-v2-item.done::after {
    background: var(--bs-primary);
}

.udm-wizard-stepper-v2-num {
    width: 1.75em;
    height: 1.75em;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85em;
    font-weight: 700;
    background: var(--bs-gray-200);
    color: var(--bs-gray-500);
    flex-shrink: 0;
    transition: all 0.25s ease;
}

.udm-wizard-stepper-v2-item.active .udm-wizard-stepper-v2-num {
    background: var(--bs-primary);
    color: #fff;
}

.udm-wizard-stepper-v2-item.done .udm-wizard-stepper-v2-num {
    background: var(--bs-primary);
    color: #fff;
}

.udm-wizard-stepper-v2-text {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.udm-wizard-stepper-v2-title {
    font-size: 1em;
    font-weight: 600;
    color: var(--bs-gray-500);
}

.udm-wizard-stepper-v2-item.active .udm-wizard-stepper-v2-title {
    color: var(--bs-primary);
}

.udm-wizard-stepper-v2-item.done .udm-wizard-stepper-v2-title {
    color: var(--bs-primary);
}

.udm-wizard-stepper-v2-subtitle {
    font-size: 0.85em;
    color: var(--bs-gray-400);
}


/* --- V2 Typ-Karten (nur Icon + Titel, Detail-Card bei Auswahl) --- */

.udm-wizard-type-cards {
    display: grid;
    gap: 0.5em;
}

.udm-wizard-type-cards--3 { grid-template-columns: repeat(3, 1fr); }
.udm-wizard-type-cards--4 { grid-template-columns: repeat(4, 1fr); }
.udm-wizard-type-cards--6 { grid-template-columns: repeat(6, 1fr); }

.udm-wizard-type-card {
    border: 1.5px solid var(--bs-gray-200);
    border-radius: 0.6em;
    padding: 0.75em 0.5em 0.65em;
    cursor: pointer;
    text-align: center;
    background: var(--bs-body-bg);
    transition: all 0.15s ease;
}

.udm-wizard-type-card:hover {
    border-color: rgba(var(--bs-primary-rgb), 0.35);
    background: rgba(var(--bs-primary-rgb), 0.02);
}

.udm-wizard-type-card.selected {
    border-color: var(--bs-primary);
    border-width: 2px;
    padding: calc(0.75em - 0.5px) calc(0.5em - 0.5px) calc(0.65em - 0.5px);
    background: rgba(var(--bs-primary-rgb), 0.04);
}

.udm-wizard-type-card-icon {
    font-size: 2em;
    color: var(--bs-gray-500);
    display: block;
    margin-bottom: 0.2em;
    transition: color 0.15s ease;
}

.udm-wizard-type-card:hover .udm-wizard-type-card-icon,
.udm-wizard-type-card.selected .udm-wizard-type-card-icon {
    color: var(--bs-primary);
}

.udm-wizard-type-card-title {
    font-size: 1em;
    font-weight: 600;
    color: var(--bs-gray-600);
    line-height: 1.25;
}

.udm-wizard-type-card.selected .udm-wizard-type-card-title {
    color: var(--bs-primary);
    font-weight: 700;
}


/* --- Detail-Card (Beschreibung des ausgewaehlten Typs) --- */

.udm-wizard-detail-card {
    margin-top: 0.75em;
    padding: 0.85em 1.1em;
    background: rgba(var(--bs-primary-rgb), 0.03);
    border: 1px solid rgba(var(--bs-primary-rgb), 0.12);
    border-radius: 0.5em;
    display: flex;
    align-items: flex-start;
    gap: 0.85em;
}

.udm-wizard-detail-card-icon {
    width: 2.75em;
    height: 2.75em;
    border-radius: 0.5em;
    background: rgba(var(--bs-primary-rgb), 0.08);
    color: var(--bs-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3em;
    flex-shrink: 0;
}

.udm-wizard-detail-card-text h4 {
    font-size: 1.1em;
    font-weight: 700;
    color: var(--bs-primary);
    margin: 0 0 0.2em;
}

.udm-wizard-detail-card-text p {
    font-size: 0.9em;
    color: var(--bs-gray-600);
    margin: 0;
    line-height: 1.45;
}


/* --- V2 Sticky Footer --- */

.udm-wizard-footer-v2 {
    border-top: 1px solid var(--bs-gray-200);
    padding: 0.7em 1.5em;
    display: flex;
    align-items: center;
    gap: 1em;
    background: var(--bs-gray-100);
    flex-shrink: 0;
}

.udm-wizard-footer-v2-info {
    display: flex;
    align-items: center;
    gap: 0.5em;
    font-size: 0.9em;
    color: var(--bs-gray-500);
    flex: 1;
    min-width: 0;
}

.udm-wizard-footer-v2-info i {
    color: var(--bs-gray-400);
    flex-shrink: 0;
}

.udm-wizard-footer-v2-info span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.udm-wizard-footer-v2-progress {
    display: flex;
    align-items: center;
    gap: 0.5em;
    flex-shrink: 0;
}

.udm-wizard-footer-v2-step {
    font-size: 0.85em;
    color: var(--bs-gray-500);
    font-weight: 600;
}

.udm-wizard-footer-v2-bar-wrap {
    width: 5em;
    height: 4px;
    background: var(--bs-gray-300);
    border-radius: 2px;
    overflow: hidden;
}

.udm-wizard-footer-v2-bar {
    height: 100%;
    background: var(--bs-primary);
    border-radius: 2px;
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.udm-wizard-footer-v2-actions {
    display: flex;
    gap: 0.5em;
    flex-shrink: 0;
}


/* --- V2 Buttons (Ergaenzung: Success-Button fuer letzten Schritt) --- */

.udm-wizard-btn--success {
    background: var(--bs-success);
    color: #fff;
    box-shadow: 0 1px 3px rgba(var(--bs-success-rgb), 0.3);
}

.udm-wizard-btn--success:hover:not(:disabled) {
    box-shadow: 0 3px 8px rgba(var(--bs-success-rgb), 0.35);
    filter: brightness(1.05);
}

.udm-wizard-btn i {
    font-size: 0.8em;
}

.udm-wizard-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4em;
}


/* --- V2 Summary Rows --- */

.udm-wizard-summary-v2 {
    display: flex;
    flex-direction: column;
    gap: 0.45em;
}

.udm-wizard-summary-v2-row {
    display: flex;
    align-items: center;
    gap: 0.7em;
    padding: 0.5em 0.75em;
    background: var(--bs-gray-100);
    border-radius: 0.35em;
    font-size: 0.9em;
}

.udm-wizard-summary-v2-icon {
    width: 2em;
    height: 2em;
    border-radius: 0.4em;
    background: rgba(var(--bs-primary-rgb), 0.08);
    color: var(--bs-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9em;
    flex-shrink: 0;
}

.udm-wizard-summary-v2-label {
    font-weight: 600;
    color: var(--bs-gray-600);
    min-width: 7em;
    flex-shrink: 0;
}

.udm-wizard-summary-v2-value {
    color: var(--bs-body-color);
}


/* --- V2 Field Hints (Inline-Hilfe unter Labels) --- */

.udm-wizard-field-hint {
    font-size: 0.85em;
    color: var(--bs-gray-500);
    display: flex;
    align-items: center;
    gap: 0.3em;
}

.udm-wizard-field-hint i {
    font-size: 0.9em;
    color: var(--bs-gray-400);
}


/* --- V2 Type Badge (abgerundeter Pill-Style) --- */

.udm-wizard-type-badge-v2 {
    display: inline-flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.35em 0.85em;
    border-radius: 0.4em;
    background: rgba(var(--bs-primary-rgb), 0.06);
    border: 1px solid rgba(var(--bs-primary-rgb), 0.15);
    color: var(--bs-primary);
    font-weight: 600;
    font-size: 0.9em;
    margin-bottom: 0.65em;
}


/* ==========================================================================
   Object Binding Wizard
   Nur Layout-Klassen die NICHT durch bestehende udm-wizard-* abgedeckt sind.
   Alles andere nutzt die globalen Wizard-CSS-Klassen.
   Master-Detail-Layout fuer Objekt-Anbindung
   ========================================================================== */

/* Override: volle Breite + Flex-Fill fuer Master-Detail */
.udm-wizard-v2:has(.obw-master-detail) .udm-wizard-v2-body {
    max-width: none;
    display: flex;
    flex-direction: column;
}

/* --- Globale Options-Leiste --- */

.obw-global-options {
    display: flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.5em 0.75em;
    background: var(--bs-gray-100);
    border-radius: 0.4em;
    border: 1px solid var(--bs-gray-200);
    margin-bottom: 0.75em;
    flex-wrap: wrap;
}

.obw-global-label {
    font-size: 0.88em;
    font-weight: 600;
    color: var(--bs-gray-500);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-right: 0.25em;
}

.obw-global-separator {
    width: 1px;
    height: 1.25em;
    background: var(--bs-gray-300);
    margin: 0 0.25em;
}

/* --- Option Chips (global + pro Objekt) --- */

.obw-option-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25em;
    padding: 0.2em 0.6em;
    border-radius: 0.3em;
    font-size: 0.88em;
    border: 1px solid var(--bs-gray-200);
    background: var(--bs-body-bg);
    cursor: pointer;
    transition: all 0.12s ease;
    white-space: nowrap;
}

.obw-option-chip:hover { border-color: var(--bs-primary); }
.obw-option-chip.active {
    border-color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.06);
    color: var(--bs-primary);
    font-weight: 600;
}

.obw-option-chip-sm {
    display: inline-flex;
    align-items: center;
    gap: 0.2em;
    padding: 0.15em 0.5em;
    border-radius: 0.25em;
    font-size: 0.88em;
    border: 1px solid var(--bs-gray-200);
    background: var(--bs-body-bg);
    cursor: pointer;
    transition: all 0.12s ease;
    white-space: nowrap;
}

.obw-option-chip-sm:hover { border-color: var(--bs-primary); }
.obw-option-chip-sm.active {
    border-color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.06);
    color: var(--bs-primary);
    font-weight: 600;
}

/* --- Master-Detail Container --- */

.obw-master-detail {
    display: grid;
    grid-template-columns: minmax(16em, 22em) 1fr;
    border: 1px solid var(--bs-gray-200);
    border-radius: 0.4em;
    overflow: hidden;
    flex: 1;
    min-height: 0;
    font-size: 0.88em;
}

/* --- Master (linke Spalte) --- */

.obw-master {
    border-right: 1px solid var(--bs-gray-200);
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.obw-master-header {
    padding: 0.5em 0.65em;
    border-bottom: 1px solid var(--bs-gray-200);
    background: var(--bs-gray-100);
    display: flex;
    flex-direction: column;
    gap: 0.35em;
}

.obw-master-header-row {
    display: flex;
    align-items: center;
    gap: 0.4em;
}

.obw-master-title {
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--bs-gray-500);
}

.obw-master-count {
    color: var(--bs-primary);
    font-weight: 600;
    margin-left: auto;
}

.obw-master-list {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
}

.obw-master-item {
    display: flex;
    align-items: center;
    gap: 0.3em;
    padding: 0.15em 0.4em;
    cursor: pointer;
    border-bottom: 1px solid var(--bs-gray-100);
    transition: background 0.1s ease;
}

.obw-master-item > input[type="checkbox"],
.obw-column-item > input[type="checkbox"] {
    flex-shrink: 0;
    width: 0.9em;
    height: 0.9em;
    margin: 0;
    accent-color: var(--bs-primary);
    cursor: pointer;
}

.obw-master-item:hover { background: rgba(var(--bs-primary-rgb), 0.04); }
.obw-master-item.focused {
    background: rgba(var(--bs-primary-rgb), 0.06);
    border-left: 3px solid var(--bs-primary);
    padding-left: calc(0.5em - 3px);
}

.obw-master-item.bound { opacity: 0.5; }

.obw-obj-name {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.obw-master-item.focused .obw-obj-name { font-weight: 600; }

.obw-bound-icon { color: var(--bs-success); flex-shrink: 0; }
.obw-art-dots { flex-shrink: 0; }
.obw-badge { flex-shrink: 0; }

.obw-master-footer {
    padding: 0.3em 0.5em;
    border-top: 1px solid var(--bs-gray-200);
    background: var(--bs-gray-100);
    display: flex;
    align-items: center;
    gap: 0.3em;
    color: var(--bs-gray-500);
    white-space: nowrap;
    font-size: 0.88em;
}

.obw-master-footer-info { margin-left: auto; overflow: hidden; text-overflow: ellipsis; }

/* --- Artefakt-Dots --- */

.obw-art-dots {
    display: flex;
    gap: 0.15em;
    flex-shrink: 0;
    margin-left: auto;
}

.obw-dot {
    width: 0.45em;
    height: 0.45em;
    border-radius: 50%;
    display: inline-block;
}

.obw-dot.on { background: var(--bs-primary); }
.obw-dot.off { background: var(--bs-gray-300); }

.obw-art-legend {
    display: flex;
    gap: 0.5em;
    color: var(--bs-gray-500);
    margin-left: auto;
}

.obw-art-legend span { display: flex; align-items: center; gap: 0.15em; }

/* --- Detail (rechte Spalte) --- */

.obw-detail {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.obw-detail-header {
    padding: 0.6em 0.85em;
    border-bottom: 1px solid var(--bs-gray-200);
    background: var(--bs-gray-100);
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.obw-detail-meta {
    color: var(--bs-gray-600);
    margin-left: auto;
}

.obw-detail-config {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65em;
    padding: 0.65em 0.85em;
    background: var(--bs-gray-50);
    border-bottom: 1px solid var(--bs-gray-200);
}

.obw-config-field label {
    display: block;
    margin-bottom: 0.2em;
}

.obw-detail-options {
    display: flex;
    align-items: center;
    gap: 0.3em;
    padding: 0.4em 0.85em;
    background: var(--bs-gray-50);
    border-bottom: 1px solid var(--bs-gray-200);
    flex-wrap: wrap;
}

/* --- Spalten-Header --- */

.obw-detail-col-header {
    display: flex;
    align-items: center;
    padding: 0.35em 0.85em;
    border-bottom: 1px solid var(--bs-gray-200);
    gap: 0.5em;
}

.obw-col-count {
    color: var(--bs-primary);
    font-weight: 600;
}

.obw-col-actions { margin-left: auto; display: flex; gap: 0.2em; }

.obw-column-list {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
}

.obw-column-item {
    display: flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.1em 0.65em;
    border-bottom: 1px solid var(--bs-gray-100);
    line-height: 1.3;
}

.obw-column-item > input[type="checkbox"] { flex-shrink: 0; }

.obw-column-item:hover { background: rgba(var(--bs-primary-rgb), 0.02); }
.obw-column-item.pk { background: rgba(var(--bs-warning-rgb), 0.06); }

.obw-col-name { white-space: nowrap; }

.obw-pk-badge {
    font-weight: 600;
    padding: 0.05em 0.3em;
    border-radius: 0.2em;
    background: rgba(146, 64, 14, 0.15);
    color: #92400e;
    flex-shrink: 0;
}

.obw-fk-badge {
    font-weight: 600;
    padding: 0.05em 0.3em;
    border-radius: 0.2em;
    background: rgba(var(--bs-info-rgb), 0.15);
    color: var(--bs-info);
    flex-shrink: 0;
}

.obw-column-item.fk { background: rgba(var(--bs-info-rgb), 0.04); }

.obw-col-type {
    color: var(--bs-body-color);
    font-family: 'Consolas', 'Courier New', monospace;
    white-space: nowrap;
    margin-left: auto;
}

.obw-col-null {
    color: var(--bs-gray-600);
    white-space: nowrap;
    flex-shrink: 0;
}

/* --- Bound Hint --- */

.obw-detail-bound-hint {
    display: flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.4em 0.85em;
    background: rgba(var(--bs-success-rgb), 0.06);
    border-bottom: 1px solid var(--bs-gray-200);
    color: var(--bs-success);
    font-size: 0.88em;
}

/* --- Detail Empty State --- */

.obw-detail-empty {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.5em;
    color: var(--bs-gray-400);
    padding: 3em;
}

.obw-detail-empty i { font-size: 2em; opacity: 0.3; }

/* --- Ergebnis-Anzeige --- */

.obw-results {
    margin-top: 0.75em;
    padding: 0.65em 0.85em;
    border: 1px solid var(--bs-gray-200);
    border-radius: 0.4em;
    background: var(--bs-gray-50);
}

.obw-results-title {
    font-size: 0.88em;
    font-weight: 600;
    color: var(--bs-gray-600);
    margin-bottom: 0.4em;
}

.obw-result-item {
    display: flex;
    align-items: center;
    gap: 0.4em;
    padding: 0.25em 0;
    font-size: 0.88em;
}

.obw-result-item.success i { color: var(--bs-success); }
.obw-result-item.error i { color: var(--bs-danger); }
.obw-result-item small { color: var(--bs-gray-500); margin-left: 0.5em; }

/* --- Summary-Wrap (begrenzte Breite fuer Step 2) --- */

.obw-summary-wrap {
    max-width: 52em;
    margin: 0 auto;
    width: 100%;
}

/* --- Summary-Objekte (Step 2) --- */

.obw-summary-object {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 0.3em;
    padding: 0.15em 0.5em;
    border: 1px solid var(--bs-gray-200);
    border-radius: 0.3em;
    margin-bottom: 0.2em;
    line-height: 1.3;
}

.obw-summary-pk {
    font-size: 0.88em;
    color: var(--bs-gray-500);
    margin-left: auto;
}

/* --- Creating Status --- */

.obw-creating-status {
    display: flex;
    align-items: center;
    gap: 0.5em;
    padding: 0.85em;
    margin-top: 0.75em;
    background: rgba(var(--bs-primary-rgb), 0.04);
    border: 1px solid rgba(var(--bs-primary-rgb), 0.15);
    border-radius: 0.4em;
    color: var(--bs-primary);
}


/* =============================================================
   System-Anbindungs-Wizard (sbw-*)
   Erweitert die .udm-wizard-type-card-Klassen um einen
   disabled-Zustand (noch nicht unterstuetzte System-Typen)
   und einen Subtitle unter dem Titel.
   ============================================================= */

.udm-wizard-type-card.disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.udm-wizard-type-card.disabled:hover {
    border-color: var(--bs-gray-200);
    background: var(--bs-body-bg);
}

.udm-wizard-type-card.disabled .udm-wizard-type-card-icon {
    color: var(--bs-gray-400);
}

.sbw-type-card-sub {
    font-size: 0.78em;
    color: var(--bs-gray-500);
    margin-top: 0.15em;
    line-height: 1.2;
}

.udm-wizard-type-card.selected .sbw-type-card-sub {
    color: var(--bs-primary);
}

.udm-wizard-type-card.disabled .sbw-type-card-sub {
    font-style: italic;
}


/* --- Capabilities-Pills in der Detail-Card --- */

.sbw-capabilities {
    margin-top: 0.55em;
    display: flex;
    flex-wrap: wrap;
    gap: 0.3em;
}

.sbw-cap-pill {
    font-size: 0.78em;
    padding: 0.18em 0.55em;
    border-radius: 0.8em;
    background: var(--bs-body-bg);
    border: 1px solid rgba(var(--bs-primary-rgb), 0.25);
    color: var(--bs-primary);
    font-weight: 600;
}


/* --- Platzhalter fuer noch nicht implementierte Steps --- */

.sbw-placeholder {
    display: flex;
    align-items: center;
    gap: 1em;
    padding: 1.5em 1.25em;
    background: var(--bs-gray-100);
    border: 1px dashed var(--bs-gray-300);
    border-radius: 0.6em;
    color: var(--bs-gray-600);
}

.sbw-placeholder > i {
    font-size: 2em;
    color: var(--bs-gray-400);
    flex-shrink: 0;
}


/* --- Test-Ergebnis-Banner (Step 3) --- */

.sbw-test-result {
    display: flex;
    gap: 1em;
    align-items: flex-start;
    padding: 1em 1.15em;
    border-radius: 0.6em;
    margin-bottom: 1em;
}

.sbw-test-result--success {
    background: rgba(var(--bs-success-rgb), 0.08);
    border: 1px solid rgba(var(--bs-success-rgb), 0.3);
}

.sbw-test-result--error {
    background: rgba(var(--bs-danger-rgb), 0.06);
    border: 1px solid rgba(var(--bs-danger-rgb), 0.25);
}

.sbw-test-result-icon {
    width: 2.2em;
    height: 2.2em;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
}

.sbw-test-result--success .sbw-test-result-icon { background: var(--bs-success); }
.sbw-test-result--error .sbw-test-result-icon { background: var(--bs-danger); }

.sbw-test-result-body h4 {
    font-size: 1em;
    font-weight: 700;
    margin: 0 0 0.2em;
}

.sbw-test-result--success .sbw-test-result-body h4 { color: var(--bs-success); }
.sbw-test-result--error .sbw-test-result-body h4 { color: var(--bs-danger); }

.sbw-test-result-body p {
    margin: 0;
    font-size: 0.9em;
    color: var(--bs-gray-700);
}


/* --- Stat-Karten --- */

.sbw-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.6em;
    margin-bottom: 1em;
}

.sbw-stat {
    padding: 0.7em 0.85em;
    background: var(--bs-gray-100);
    border-radius: 0.4em;
    border-left: 3px solid var(--bs-primary);
}

.sbw-stat-label {
    font-size: 0.75em;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--bs-gray-500);
    font-weight: 600;
}

.sbw-stat-value {
    font-size: 0.95em;
    font-weight: 700;
    color: var(--bs-gray-700);
    margin-top: 0.15em;
    word-break: break-word;
}


/* --- Feature-Liste --- */

.sbw-feature-list {
    padding: 0.8em 1em;
    border: 1px solid var(--bs-gray-200);
    border-radius: 0.5em;
    background: var(--bs-body-bg);
    margin-bottom: 1em;
}

.sbw-feature-list h5 {
    font-size: 0.8em;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--bs-gray-500);
    font-weight: 700;
    margin: 0 0 0.55em;
}

.sbw-feature-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.3em 1em;
}

.sbw-feature-list li {
    font-size: 0.88em;
    color: var(--bs-gray-700);
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.sbw-feature-list li i { width: 1em; text-align: center; }
.sbw-feature-list li.yes i { color: var(--bs-success); }
.sbw-feature-list li.no { color: var(--bs-gray-500); }
.sbw-feature-list li.no i { color: var(--bs-gray-400); }


/* --- Datenbank-Liste --- */

.sbw-dblist {
    padding: 0.8em 1em;
    border: 1px solid var(--bs-gray-200);
    border-radius: 0.5em;
    background: var(--bs-body-bg);
}

.sbw-dblist h5 {
    font-size: 0.8em;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--bs-gray-500);
    font-weight: 700;
    margin: 0 0 0.55em;
}

.sbw-dblist-items {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3em;
}

.sbw-dblist-item {
    font-size: 0.82em;
    padding: 0.2em 0.6em;
    border-radius: 0.3em;
    background: var(--bs-gray-100);
    color: var(--bs-gray-700);
    border: 1px solid var(--bs-gray-200);
}

.sbw-dblist-item.current {
    background: rgba(var(--bs-primary-rgb), 0.1);
    border-color: var(--bs-primary);
    color: var(--bs-primary);
    font-weight: 600;
}


/* --- Step 4: System-Explorer (Split-Layout) --- */

/* Modifier fuer den Wizard-Body im Explorer-Step:
   - max-width aufgehoben (volle Breite)
   - Body selbst scrollt NICHT; stattdessen fuellt der Explorer die Hoehe
     und die inneren Container (Tree, Preview) scrollen einzeln. */
.udm-wizard-v2-body.sbw-body--wide {
    max-width: none;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.udm-wizard-v2-body.sbw-body--wide > .udm-wizard-section {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.sbw-explorer {
    display: grid;
    grid-template-columns: 20em 1fr;
    border: 1px solid var(--bs-gray-200);
    border-radius: 0.5em;
    overflow: hidden;
    width: 100%;
    flex: 1;
    min-height: 20em;
}


/* Linker Baum */

.sbw-tree {
    background: var(--bs-gray-100);
    border-right: 1px solid var(--bs-gray-200);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.sbw-tree-search {
    padding: 0.55em 0.7em;
    border-bottom: 1px solid var(--bs-gray-200);
    flex-shrink: 0;
}

.sbw-tree-body {
    overflow-y: auto;
    padding: 0.3em 0;
    flex: 1;
}

.sbw-tree-group {
    padding: 0.4em 0.85em 0.25em;
    font-size: 0.72em;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--bs-gray-500);
    font-weight: 700;
    display: flex;
    justify-content: space-between;
}

.sbw-tree-group-count {
    font-weight: 500;
    color: var(--bs-gray-400);
    text-transform: none;
    letter-spacing: 0;
}

.sbw-tree-item {
    padding: 0.35em 0.85em;
    font-size: 0.88em;
    color: var(--bs-gray-700);
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.sbw-tree-item:hover {
    background: rgba(var(--bs-primary-rgb), 0.06);
}

.sbw-tree-item.selected {
    background: rgba(var(--bs-primary-rgb), 0.12);
    color: var(--bs-primary);
    font-weight: 600;
}

.sbw-tree-item-icon {
    color: var(--bs-gray-500);
    flex-shrink: 0;
}

.sbw-tree-item.selected .sbw-tree-item-icon { color: var(--bs-primary); }
.sbw-tree-item.is-view .sbw-tree-item-icon { color: var(--bs-info); }

.sbw-tree-item-name {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sbw-tree-item-schema {
    font-size: 0.75em;
    color: var(--bs-gray-500);
    font-weight: 500;
}

.sbw-tree-status {
    padding: 1em;
    font-size: 0.85em;
    color: var(--bs-gray-600);
    display: flex;
    align-items: center;
    gap: 0.5em;
}

.sbw-tree-status--error { color: var(--bs-danger); }


/* Rechtes Detail-Panel */

.sbw-detail {
    display: flex;
    flex-direction: column;
    background: var(--bs-body-bg);
    overflow: hidden;
}

.sbw-detail-empty {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    color: var(--bs-gray-500);
    font-size: 0.9em;
}

.sbw-detail-empty i {
    font-size: 2.5em;
    color: var(--bs-gray-300);
}

.sbw-detail-header {
    padding: 0.65em 1em;
    border-bottom: 1px solid var(--bs-gray-200);
    display: flex;
    align-items: center;
    gap: 0.5em;
    flex-shrink: 0;
    background: var(--bs-body-bg);
}

.sbw-detail-header i {
    color: var(--bs-gray-500);
}

.sbw-detail-header h5 {
    font-size: 0.95em;
    font-weight: 700;
    color: var(--bs-gray-700);
    margin: 0;
}

.sbw-detail-meta {
    font-size: 0.8em;
    color: var(--bs-gray-500);
}

.sbw-detail-tabs {
    display: flex;
    border-bottom: 1px solid var(--bs-gray-200);
    padding: 0 0.7em;
    background: var(--bs-body-bg);
    flex-shrink: 0;
}

.sbw-detail-tab {
    padding: 0.5em 0.85em;
    font-size: 0.83em;
    color: var(--bs-gray-500);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.4em;
}

.sbw-detail-tab:hover { color: var(--bs-gray-700); }

.sbw-detail-tab.active {
    color: var(--bs-primary);
    border-bottom-color: var(--bs-primary);
}

.sbw-detail-content {
    flex: 1;
    overflow: auto;
    padding: 0;
}


/* Spalten-Tabelle */

.sbw-columns-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85em;
}

.sbw-columns-table thead th {
    background: var(--bs-gray-100);
    padding: 0.4em 0.85em;
    text-align: left;
    font-weight: 700;
    color: var(--bs-gray-600);
    font-size: 0.75em;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    position: sticky;
    top: 0;
}

.sbw-columns-table tbody td {
    padding: 0.35em 0.85em;
    border-bottom: 1px solid var(--bs-gray-200);
}

.sbw-columns-table tr.pk td { font-weight: 600; }

.sbw-col-type {
    color: var(--bs-gray-700);
}

.sbw-col-len {
    color: var(--bs-gray-500);
    font-size: 0.85em;
    margin-left: 0.25em;
}

.sbw-col-flag {
    font-size: 0.7em;
    padding: 0.1em 0.45em;
    border-radius: 0.25em;
    font-weight: 700;
    margin-right: 0.25em;
}

.sbw-col-flag.pk {
    background: rgba(var(--bs-warning-rgb, 252, 185, 44), 0.2);
    color: #8a6d00;
}

.sbw-col-flag.nn {
    background: var(--bs-gray-200);
    color: var(--bs-gray-700);
}


/* Preview-Tabelle */

.sbw-preview-meta {
    padding: 0.45em 0.85em;
    font-size: 0.78em;
    color: var(--bs-gray-500);
    background: var(--bs-gray-100);
    border-bottom: 1px solid var(--bs-gray-200);
}

.sbw-preview-scroll {
    overflow: auto;
}

.sbw-preview-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8em;
}

.sbw-preview-table thead th {
    background: var(--bs-gray-100);
    padding: 0.35em 0.65em;
    text-align: left;
    font-weight: 700;
    color: var(--bs-gray-700);
    font-size: 0.72em;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
    position: sticky;
    top: 0;
    z-index: 1;
}

.sbw-preview-table tbody td {
    padding: 0.3em 0.65em;
    border-bottom: 1px solid var(--bs-gray-200);
    white-space: nowrap;
    max-width: 18em;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sbw-preview-table td.null em {
    color: var(--bs-gray-400);
    font-style: italic;
    font-size: 0.85em;
}

.sbw-preview-status {
    padding: 1em 1.2em;
    font-size: 0.88em;
    color: var(--bs-gray-600);
    display: flex;
    align-items: center;
    gap: 0.6em;
}

.sbw-preview-status--error { color: var(--bs-danger); }