/**
 * Wizard Layout Styles
 * Layout та структурні стилі wizard
 */

/* Лівий блок з інформацією */
.wizard-info {
    padding-right: 2rem;
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Заголовок блок - зсунуто вниз на 34px */
.wizard-header {
    flex: 0 0 auto;
    margin-bottom: auto;
    margin-top: 34px; /* Зсув вниз на 34px */
}

.wizard-title {
    color: var(--wizard-text-primary);
    text-align: center;
    font-family: 'Dela Gothic One', cursive;
    font-size: 36px;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: 1.08px;
    margin-bottom: 1.25rem;
}

.wizard-description {
    color: var(--wizard-text-secondary);
    text-align: center;
    font-family: 'Geologica', sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 140%;
    margin-bottom: 0;
}

/* Промо блок - зсунуто вверх на 67px (34px + додаткові 33px) */
.wizard-promo {
    padding: 32px;
    border-radius: 16px;
    border: 2px solid var(--wizard-accent);
    background: transparent;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    margin-bottom: 35px;
}

.promo-logo img {
    max-height: 60px;
    width: auto;
}

.promo-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.promo-text {
    color: var(--wizard-text-secondary);
    font-family: 'Geologica', sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 140%;
    margin-bottom: 0;
}

.promo-discount {
    color: var(--wizard-primary);
    font-family: 'Dela Gothic One', cursive;
    font-size: 42px;
    font-weight: 400;
    line-height: 120%;
    letter-spacing: 1.26px;
}

/* Контейнер wizard */
.wizard-container {
    background: var(--wizard-bg-primary);
    border-radius: 20px;
    overflow: hidden;
    height: 640px;
    position: relative;
    display: flex;
    flex-direction: column;
}

/* Контент wizard */
.wizard-content {
    flex: 1;
    padding: 0 32px 32px;
    overflow: hidden;
}

.wizard-step {
    display: none;
    height: 100%;
}

.wizard-step.active {
    display: block;
}