/* Shared full-page wizard stepper (PreStartCheck, InvestigateIncident, etc.) */

.wizard-stepper {
    background: var(--hav-ground);
    border-radius: 0;
    box-shadow: none;
}

.wizard-stepper .mud-stepper-content {
    min-height: 400px;
    padding: var(--hav-panel-pad-compact);
}

.wizard-stepper .mud-step-completed .mud-step-icon {
    background-color: var(--hav-success);
}

.wizard-stepper .mud-step-active .mud-step-icon {
    background-color: var(--hav-accent);
}

.wizard-stepper .mud-stepper-nav {
    padding-inline: calc(var(--hav-space-2) / 4);
    row-gap: 4px;
}

.wizard-stepper .mud-stepper-nav .mud-stepper-line,
.wizard-stepper .mud-stepper-nav .mud-stepper-nav-connector {
    flex: 0 0 11px;
    max-width: 11px;
    min-width: 11px;
}

.wizard-stepper .mud-step {
    flex: 1 1 0;
    min-width: 0;
}

/* MudBlazor 9 sets .mud-step min-width: fit-content, which makes the nav
   horizontally scroll inside the 720px wizard dialog. Restore shrinkability. */
.wizard-stepper .mud-stepper-nav .mud-step {
    min-width: 0 !important;
}

.wizard-stepper .mud-step-label,
.wizard-stepper .mud-step-label-content,
.wizard-stepper .mud-step .mud-typography {
    font-size: 0.72rem;
    line-height: 1.2;
    white-space: normal;
    word-break: break-word;
    hyphens: auto;
    text-align: center;
    max-width: 100%;
}

.wizard-stepper .mud-step-icon {
    transform: scale(0.9);
}

.wizard-stepper-footer-progress {
    flex-wrap: nowrap;
    flex-shrink: 0;
}

.wizard-stepper-step-header {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.wizard-stepper-step-label {
    white-space: nowrap;
    flex-shrink: 0;
    font-family: var(--hav-font-head);
    text-transform: uppercase;
    letter-spacing: .06em;
    font-size: 12px;
    color: var(--hav-text-muted);
}

.wizard-stepper-progress-bar {
    width: 120px;
    min-width: 120px;
    flex-shrink: 0;
    height: 5px;
    background: var(--hav-line);
}

.wizard-stepper-progress-bar > span {
    display: block;
    height: 100%;
    background: var(--hav-accent);
    transition: width .2s ease;
}

/* Wizard dialogs draw single-line step labels per the blueprint; never wrap mid-label. */
.havto-dialog-wizard .wizard-stepper .mud-step-label-content,
.havto-dialog-wizard .wizard-stepper .mud-step .mud-typography {
    white-space: nowrap;
    word-break: normal;
    hyphens: none;
}

/* Side panels: stepper nav tuning without card chrome (panel provides the container) */
.wizard-stepper--panel {
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}

.wizard-stepper--panel .mud-stepper-content {
    padding: 0;
    min-height: unset;
}

.wizard-stepper--panel .mud-step-label,
.wizard-stepper--panel .mud-step-label-content,
.wizard-stepper--panel .mud-step .mud-typography {
    text-transform: uppercase;
}

@media (max-width: 768px) {
    .wizard-stepper .mud-stepper-nav .mud-stepper-line,
    .wizard-stepper .mud-stepper-nav .mud-stepper-nav-connector {
        flex-basis: 7px;
        max-width: 7px;
        min-width: 7px;
    }

    .wizard-stepper .mud-step-label,
    .wizard-stepper .mud-step-label-content,
    .wizard-stepper .mud-step .mud-typography {
        font-size: 0.68rem;
        word-break: normal;
        overflow-wrap: break-word;
        hyphens: none;
    }

    /* Four-step nav in the 720 wizard dialog: drop the secondary caption so
       step titles hold one word per line instead of breaking mid-word. */
    .wizard-stepper .mud-step-label-content-secondary-text {
        display: none;
    }

    .wizard-stepper-progress-bar {
        width: 96px;
        min-width: 96px;
    }

    .wizard-stepper-progress-bar > span {
        transition: none;
    }
}