#step-material [hidden], #material-preview-modal [hidden] { display: none !important; }
#step-material .material-swatch { object-fit: cover; }
#step-material #catalog-results[aria-busy="true"] { opacity: .55; pointer-events: none; }
#step-material .material-selection-empty { display: flex; align-items: center; gap: 1rem; }
#step-material .material-selection-empty .material-swatch { display: grid; place-items: center; background: var(--fn-tertiary-bg); }
#step-material .material-name { overflow-wrap: anywhere; }
#step-material .catalog-filter-chip { text-align: left; }
#step-material .catalog-pagination { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-top: 1.5rem; }
#step-material .material-candidate-title { font-size: .875rem; font-weight: 600; }
#material-preview-image { width: 100%; height: 100%; object-fit: contain; }
#material-preview-modal .material-preview { display: grid; place-items: center; }
@media (min-width: 992px) {
    #step-material #catalog-filters .offcanvas-body { max-height: max(140px, calc(100dvh - var(--wizard-catalog-filter-top, 260px) - var(--wizard-catalog-footer-height, 90px) - 16px)); }
}
@media (max-width: 767.98px) {
    .wizard-footer #material-next-context { flex-basis: 100%; order: -1; }
    .wizard-footer #material-next { margin-left: auto; max-width: 100%; }
}

#step-material .material-selection-restore {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto 1.75rem;
    align-items: center;
    gap: .75rem;
    padding: .625rem .75rem;
    border: 1px solid var(--fn-border-color);
    border-radius: var(--fn-border-radius);
    background: var(--fn-tertiary-bg);
}
#step-material .material-restore-image {
    width: 44px;
    height: 44px;
    object-fit: cover;
    border: 1px solid var(--fn-border-color);
    border-radius: var(--fn-border-radius-sm);
}
#step-material .material-restore-info { min-width: 0; }
#step-material .material-restore-title {
    color: var(--fn-body-color);
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.35;
    overflow-wrap: anywhere;
}
#step-material .material-restore-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .125rem .625rem;
    margin-top: .125rem;
    color: var(--fn-secondary-color);
    font-size: .75rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}
#step-material .material-restore-button { max-width: 15rem; white-space: normal; }
#step-material .material-restore-dismiss {
    width: 1.75rem;
    height: 1.75rem;
    margin: 0;
    padding: 0;
    background-size: .6875rem;
}
@media (max-width: 575.98px) {
    #step-material .material-selection-restore {
        grid-template-columns: 44px minmax(0, 1fr) 1.75rem;
        gap: .5rem .625rem;
        padding-inline: .625rem;
    }
    #step-material .material-restore-button { grid-column: 1 / -1; grid-row: 2; width: 100%; max-width: none; }
    #step-material .material-restore-dismiss { grid-column: 3; grid-row: 1; align-self: start; }
}
