main {
    background-color: transparent;
    width: 100%;
    max-width: 721px;
    margin: auto;
    padding-top: 50px;
    padding-bottom: 100px;
}

.compensation-form {
    padding: 0 16px;
}

#form-step-container {
    min-height: 100%;
}

.input-group {
    .input-group__icon {
        &.input-group__icon--reverse {
            & ~ .input {
                border-radius: var(--sp-1);
            }
        }
    }
}

.compensation-form-header {
    display: flex;
    height: 80px;
    padding: 0 clamp(0px, 3%, 90px);
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    flex-shrink: 0;

    .compensation-form-header__logo {
        flex-shrink: 0;
        width: clamp(80px, 10%, 147px);
    }

    .compensation-form-header__steps {
        display: flex;
        gap: 12px;
        align-items: center;

        .compensation-form-header__step {
            display: flex;
            height: 40px;
            padding: 0 16px;
            align-items: center;
            gap: var(--sp-1);
            border: 1px solid #FFF;
            border-radius: var(--sp-4);
            opacity: .5;

            .compensation-form-header__step-icon {
                flex-shrink: 0;
            }

            &.compensation-form-header__step--active {
                border: 1px solid #EEF1FE;
                box-shadow: 0 2px 4px 0 rgba(73, 85, 195, 0.10);
                color: var(--color-blue-900);
                opacity: 1;

                .compensation-form-header__step-icon {
                    color: var(--color-blue-600);
                }
            }

            &.compensation-form-header__step--complete {
                color: var(--color-blue-900);
                opacity: 1;

                .compensation-form-header__step-icon {
                    color: var(--color-blue-600);
                }
            }
        }
    }

    .compensation-form-header__help {
        display: flex;
        padding: 8px 12px;
        align-items: center;
        gap: 8px;
        border-radius: var(--sp-4);
        background: #EEF1FE;
        font-size: 16px;
        font-style: normal;
        font-weight: 600;
        line-height: normal;
        transition: transform var(--transition);

        &:hover {
            transform: scale(1.05);
            color: var(--color-blue-600);
        }
    }
}

@media all and (max-width: 1024px) {
    .compensation-form-header {
        .compensation-form-header__steps {
            gap: 4px;

            .compensation-form-header__step {
                padding: 0 8px;
            }
        }
    }
}

@media all and (max-width: 768px) {
    main {
        padding-top: 0;
        padding-bottom: 10px;
    }

    .compensation-form-header {
        padding: var(--sp-2) 0;

        .compensation-form-header__logo {
            flex-shrink: 0;
        }

        .compensation-form-header__steps {
            .compensation-form-header__step {
                width: 38px;
                height: 38px;
                min-width: 38px;
                min-height: 38px;
                padding: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                opacity: 0.5;

                &.compensation-form-header__step--active {
                    opacity: 1;
                }

                .compensation-form-header__step-text {
                    display: none;
                }
            }
        }

        .compensation-form-header__help {
            padding: 0!important;

            svg {
                width: 24px;
                height: 24px;
                min-width: 24px;
                min-height: 24px;
            }
            .compensation-form-header__help-text {
                display: none;
            }
        }
    }

    .compensation-form-footer {
        display: flex;
        flex-direction: column;
        gap: 20px;
        align-items: center;

        .compensation-form-footer__links {
            display: none!important;
        }
    }

}

.compensation-form-footer {
    background: #FFF;
    border-top: 1px solid #E4E7F6;
    display: inline-flex;
    justify-content: space-between;
    padding: 20px 30px;

    .compensation-form-footer__links {
        display: inline-flex;
        align-items: flex-start;
        gap: 32px;

        .compensation-form-footer__link, .compensation-form-footer__link:hover, .compensation-form-footer__link:active {
            font-weight: 400;
            color: #746E99;
            line-height: normal;
            font-size: 14px;
        }
    }

    .rating {
        border: 0!important;
        padding: 0!important;
    }

    .compensation-form-footer__copyright {
        color: #746E99;
        font-weight: 400;
    }
}

.compensation {
    .compensation__card {
        display: flex;
        padding: 24px;
        flex-direction: column;
        align-items: flex-start;
        gap: 22px;

        border-radius: 0 8px 8px 8px;
        border: 1px solid #EEF1FE;

        background: #FBFBFF;

        &.compensation__card--ui-front {
            z-index: 1;

            &.compensation__card--ui-front--2 {
                z-index: 2;
            }
        }

        .compensation__card-title {
            font-size: 18px;
            font-weight: 500;
            line-height: normal;
            color: var(--color-blue-800);

            @media screen and (max-width: 768px) {
                font-size: 16px;
            }

            &.compensation__card-title--blue {
                color: var(--color-blue-600);
            }
        }
    }

    .compensation__card-message {
        padding: var(--sp-2) var(--sp-3);
        font-size: 16px;
        font-weight: 500;
        line-height: normal;
        color: var(--color-blue-800);
        margin-bottom: var(--sp-2);
        width: 100%;

        border-radius: 0 var(--sp-4) var(--sp-4) var(--sp-4);
        border: 2px solid #FFF;

        background: var(--color-light);

        box-shadow: 25px 30px 100px 0 rgba(73, 85, 195, 0.10);
        backdrop-filter: blur(35px);
    }
    .compensation__card-italic {
        font-style: italic;
    }
    .compensation__card-highlight {
        font-weight: 700;
    }
    .compensation__card-heavy {
        font-size: 28px;
        font-weight: 600;
        line-height: normal;

        @media screen and (max-width: 768px) {
            font-size: var(--sp-2);
        }
    }

    .compensation__note {
        margin-top: var(--sp-4);
        display: flex;
        gap: 12px;
        align-items: center;

        &.compensation__note--mb {
            margin-top: 0;
            margin-bottom: var(--sp-4);
        }

        &:before {
            content: '';
            display: block;
            width: 42px;
            height: 42px;
            min-width: 42px;
            background: url("../../../../Media/Icon/icon-form-mascot.png") center center no-repeat;
            border-radius: 50%;
            box-shadow: 0 2px 4px 0 rgba(73, 85, 195, 0.50);
        }

        &.compensation__note--ineligible {
            &:before {
                background: url("../../../../Media/Icon/icon-form-mascot-ineligible.png") center center no-repeat;
            }
        }

        &.compensation__note--mb {
            margin-top: 0;
            margin-bottom: var(--sp-4);
        }

        .compensation__note-text {
            padding: 8px 16px;
            border-radius: var(--sp-2);
            font-style: italic;
            line-height: normal;
            background-color: #F5F7FE;
            font-weight: 500;

            @media screen and (max-width: 768px) {
                font-size: var(--sp-2);
            }
        }

        .compensation__note-highlight {
            color: var(--color-blue-600);
        }
    }

    .compensation__note-success {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 16px;

        margin-top: var(--sp-4);
        border-radius: var(--sp-2);
        border: 1px solid var(--color-green-600);
        background: linear-gradient(90deg, #E3FFEA 0%, #F5FFF8 100%);
        box-shadow: 25px 30px 100px 0 rgba(73, 85, 195, 0.10);
        backdrop-filter: blur(35px);

        .compensation__note-success-left {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .compensation__note-success-icon {
            width: 52px;
            height: 52px;
            background-color: var(--color-light);
            border: 1px solid #7EBCAC;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--color-green-600);
        }
        .compensation__note-success-text {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 4px;
        }
        .compensation__note-success-label {
            font-size: 14px;
            font-style: normal;
            font-weight: 600;
            line-height: normal;
            color: var(--color-blue-900);
        }
        .compensation__note-success-amount {
            color: var(--color-green-600);
            font-size: 22px;
            font-style: normal;
            font-weight: 700;
        }
        .compensation__note-success-details {
            color: var(--color-blue-900);
        }

        .compensation__note-success-right {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 12px;
        }
    }

    .compensation__navigation {
        margin-top: var(--sp-4);
        display: flex;
        gap: var(--sp-2);
        justify-content: space-between;

        .compensation__navigation-multi {
            display: flex;
            gap: var(--sp-2);
        }

        .btn {
            border-radius: 12px;
            display: flex;
            padding: 16px 32px;
            align-items: center;
            gap: 10px;

            &:last-child {
                margin-left: auto;
            }
        }
    }
}
.compensation__card ~ .compensation__card, .compensation__card ~ .compensation__space {
    margin-top: var(--sp-2);
}

.compensation__card:has(.eligibility){
    @media screen and (max-width: 768px) {
        padding: 0;
        border-radius: 0;
        border: none;
        box-shadow: none;
        background: none;
    }
}

.eligibility {
    width: 100%;

    .eligibility__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: var(--sp-4);

        @media screen and (max-width: 768px) {
            border-radius: 0 8px 8px 8px;
            border: 1px solid #EEF1FE;
            background: #FBFBFF;
            padding: var(--sp-2);
            flex-wrap: wrap;
            gap: var(--sp-2);
        }

        @media screen and (max-width: 330px) {
            flex-direction: column;
            align-items: flex-start;
            justify-content: flex-start;
        }

        .eligibility__header-item {
            display: flex;
            gap: var(--sp-1);

            @media screen and (max-width: 768px) {
                flex-direction: column;

                &:last-child {
                    order: -1;
                }

                /* On est inversé */
                &:first-child {
                    align-items: flex-end;
                    text-align: right;
                }

            }

            @media screen and (max-width: 330px) {
                &:first-child {
                    align-items: flex-start;
                    text-align: left;
                }
            }
        }
        .eligibility__header-icon {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;

            &.eligibility__header-icon--pink {
                background: var(--color-pink-50);
                color: var(--color-pink-600);
            }

            &.eligibility__header-icon--green {
                background-color: var(--color-green-50);
                color: var(--color-green-600);
            }
        }
        .eligibility__header-title {
            font-size: 14px;
            font-weight: 600;
            line-height: normal;

            @media screen and (max-width: 768px) {
                font-size: 12px;
            }
        }
        .eligibility__header-text {
            font-weight: 500;
            line-height: normal;

            &.eligibility__header-text--pink {
                color: var(--color-pink-600);
            }
            &.eligibility__header-text--green {
                color: var(--color-green-600);
            }
        }
    }

    .eligibility__body {
        border: 1px solid var(--color-blue-300);
        border-radius: var(--sp-1);
        overflow: hidden;
        
        @media screen and (max-width: 768px) {
            border-radius: 12px;
            background: #FFF;
            box-shadow: 0 4px 20px 0 rgba(180, 189, 232, 0.50);
            border: none ;
        }

        .eligibility__body-top {
            padding: var(--sp-2) var(--sp-4);
            background: linear-gradient(113deg, rgba(255, 255, 255, 0.90) 0%, rgba(255, 255, 255, 0) 100%);
            display: flex;
            justify-content: space-between;
            font-weight: 500;

            @media screen and (max-width: 768px) {
                padding: var(--sp-2);
                font-size: 12px;
                flex-wrap: wrap;
            }

            @media screen and (max-width: 330px) {
                flex-direction: column;
                align-items: flex-start;
                justify-content: flex-start;
            }

            .eligibility__body-top__airline{
                @media screen and (max-width: 768px) {
                    display: flex;
                    flex-direction: column;
                }
            }

            .eligibility__body-top__booking {
                @media screen and (max-width: 768px) {
                    display: flex;
                    flex-direction: column;
                    align-items: flex-end;
                }

                @media screen and (max-width: 330px) {
                    align-items: flex-start;
                }

            }

            .eligibility__body-top__problem {
                @media screen and (max-width: 768px) {
                    display: none
                }
            }
        }

        .eligibility__body-content {
            padding: 0 var(--sp-4);
            background: var(--color-light);

            @media screen and (max-width: 768px) {
                padding: 0;
            }

            .eligibility__body-route {
                display: flex;
                justify-content: space-between;
                font-weight: 500;
                padding: 20px 0;

                @media screen and (max-width: 768px) {
                    background: linear-gradient(93deg, #F5F7FE 24.08%, #FFF 52.57%, #F5F7FE 81.05%);
                    padding: 20px  var(--sp-2);
                }

                .eligibility__body-city {
                    @media screen and (max-width: 768px) {
                        font-size: 12px;
                    }
                }

                .eligibility__body-plane {
                    flex: 1;
                    padding: 0 var(--sp-2);
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    gap: var(--sp-2);

                    &:before, &:after {
                        flex: 1;
                        content: '';
                        height: 1px;
                        background: linear-gradient(90deg, #FFF 0%, #B4BDE8 100%);
                    }
                    &:after {
                        background: linear-gradient(90deg,  #B4BDE8 0%, #FFF 100%);
                    }

                    .eligibility__body-icon {
                        width: 32px;
                        height: 32px;
                        min-width: 32px;
                        min-height: 32px;
                        border-radius: 50%;
                        background: #EEF1FE;
                        display: flex;
                        align-items: center;
                        justify-content: center;

                        svg {
                            width: 14px;
                            height: 12px;
                        }
                    }
                }

            }

            .eligibility__body-details {
                display: flex;
                justify-content: space-between;
                padding: 20px 0;

                @media screen and (max-width: 768px) {
                    padding: var(--sp-2);
                    flex-wrap: wrap;
                }

                @media screen and (max-width: 330px) {
                    flex-direction: column;
                    align-items: flex-start;
                }

                .eligibility__detail-item {
                    flex: 1;

                    &:last-child {
                        flex: 0.5;
                    }

                    @media screen and (max-width: 768px) {
                        flex: 1 1 50%;
                        margin-bottom: var(--sp-2);
                        font-size: 14px;

                        &:nth-child(1),
                        &:nth-child(2) {
                            flex: 1 1 50%;
                        }

                        &:nth-child(2) {
                            text-align: right;
                            align-self: flex-end;
                            justify-self: flex-end;
                        }

                        &:last-child {
                            order: -1;
                            flex: 1 1 100%;
                            display: flex;
                            flex-direction: column;
                            justify-content: center;
                            text-align: center;
                        }
                    }

                    @media screen and (max-width: 330px) {
                        flex: 1 1 100%;
                        &:nth-child(2) {
                            text-align: left;
                            align-self: flex-start;
                            justify-self: flex-start;
                        }

                        &:last-child {
                            order: -1;
                            flex: 1 1 100%;
                            justify-content: flex-start;
                            text-align: left;
                        }
                    }

                    .eligibility__body-details-title {
                        margin-bottom: var(--sp-1);
                        font-size: 14px;
                        font-weight: 600;
                        color: var(--color-blue-900);

                        @media screen and (max-width: 768px) {
                            margin-bottom: 0;
                        }
                    }
                }
            }
        }
    }

    .eligibility__highlight {
        color: var(--color-blue-600);

        @media screen and (max-width: 768px) {
            font-size: 14px;
        }

        &.eligibility__highlight--bold {
            font-weight: 700;
        }
        &.eligibility__highlight--dark {
            color: var(--color-blue-800);
        }
    }

    .eligibility__details {
        margin-top: var(--sp-3);

        p {
            margin-bottom: var(--sp-2);
        }
    }
}


.flight-info {
    display: flex;
    justify-content: space-between;
}

.compensation__card ~ .accordions-list {
    margin-top: var(--sp-2);
}

.compensation__passenger-top {
    display: flex;
    gap: var(--sp-3);
}
@media all and (max-width: 768px) {
    .compensation__passenger-top {
        flex-direction: column;
    }
}
#passengers-container {
    margin-top: var(--sp-2);
}
.remove-passenger {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--color-grey-300);
    cursor: pointer;
    position: absolute;
    right: 24px;
    top: 24px;
    z-index: 1;
    border: 0;

    svg {
        width: 14px;
        height: 17px;
    }
}



.signature-pad__container {
    border: 1px solid #B4BDE8;
    background: #FFF;
    border-radius: var(--sp-1);
    width: 100%;

    .signature-pad__wrapper {

        #signature_pad_box {
            min-height: 250px;
        }

        .signature-pad-canvas {
            width: 100%;
            height: 100%;
            min-height: 250px;
        }

        .signature-pad__wrapper-infos {
            pointer-events: none;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: var(--sp-2);

            .signature-pad__wrapper-infos-text {
                color: var(--color-blue-600);
                font-size: 18px;
                font-weight: 500;
            }
        }

        .signature-pad__wrapper-checker {
            display: none;
        }

        .signature-pad__wrapper-erase {
            display: block;
            background: none;
            color: #5E699A;
            font-size: 14px;
            text-decoration: underline;
            margin: 0 auto;
            border: none;
            padding: 0;
            cursor: pointer;
            outline: none;
        }
    }

    .signature-pad__footer {
        border-top: 1px solid #B4BDE8;
        padding: 20px 30px;
        text-align: center;
        font-size: 14px;
        font-style: italic;
        font-weight: 400;
        color: #5E699A;
    }

    .signature-pad__text {
        font-size: 14px;
        font-weight: 500;
    }
}



.compensation-accordions-list {
    width: 100%;
    gap: var(--sp-4);

    .compensation-accordion {
        width: 100%;

        .compensation-accordion__trigger {
            display: flex;
            padding: 20px 16px;
            justify-content: space-between;
            align-items: center;
            gap: var(--sp-2);
        }
        .compensation-accordion__title {
            display: flex;
            align-items: center;
            gap: 12px;

            .compensation-accordion__title-icon {
                display: flex;
                width: 42px;
                height: 42px;
                justify-content: center;
                align-items: center;
                font-size: 24px;
                font-weight: 600;
                line-height: normal;
                color: var(--color-blue-600);
                background: #EEF1FE;
                border-radius: 50%;

            }

            .compensation-accordion__passenger {
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                gap: 4px;

                .compensation-accordion__passenger-name {
                    font-weight: 500;
                    color: var(--color-blue-900);
                }
                .compensation-accordion__passenger-type {
                    font-size: 14px;
                    color: #8B92AF;
                }
            }
        }
        .compensation-accordion__content {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 20px;

            .compensation-accordion__content-item {
                display: flex;
                padding: 8px 16px;
                align-items: center;
                justify-content: space-between;
                gap: var(--sp-4);
                width: 100%;
                border: 1px solid #EEF1FE;
                border-radius: var(--sp-2);
                background: var(--color-light);
            }
            .compensation-accordion__content-infos {
                display: flex;
                align-items: center;
                gap: 12px;
            }
            .compensation-accordion__content-icon {
                display: flex;
                width: 42px;
                height: 42px;
                justify-content: center;
                align-items: center;
                border-radius: var(--sp-1);
                background: var(--color-pink-50);
                color: var(--color-pink-600);

                &.compensation-accordion__content-icon--valid {
                    background: var(--color-green-50);
                    color: var(--color-green-600);
                }
            }
            .compensation-accordion__content-button {
                display: flex;
                border: 0;
                width: 42px;
                height: 42px;
                justify-content: center;
                align-items: center;
                border-radius: var(--sp-2);
                background: var(--color-blue-50);
            }
        }
    }
}



.input-group-btn {
    width: 100%;
    display: flex;
    align-items: flex-start;

    .input-group-btn__input {
        width: 100%;
        max-width: 350px;
        padding: 0 20px;
        height: 49px;
        border-radius: 8px 0 0 8px;
        border: 1px solid var(--color-blue-300);
        background: #FFF;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .input-group-btn__btn {
        padding: 0 38px;
        height: 49px;
        border-radius: 0 8px 8px 0;
        border: 1px solid var(--color-blue-300);
        border-left: 0;
        background: #EEF1FE;
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--color-blue-600);
        font-weight: 700;

        @media screen and (max-width: 768px) {
            padding: 0 15px;
        }
    }
}

.compensation__card:has(.compensation__card-thankyou){
    @media screen and (max-width: 768px) {
        padding: 0;
        gap: var(--sp-2);
        background: var(--color-light);
    }
}

.compensation__card-thankyou {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-bottom: var(--sp-2);

    @media screen and (max-width: 768px) {
        padding: var(--sp-2);
        margin-bottom: 0;
    }

    @media screen and (max-width: 340px) {
        flex-direction: column;
        gap: var(--sp-1);
        justify-content: flex-start;
        align-items: flex-start;
    }

    .compensation__card-thankyou-item {
        display: flex;
        flex-direction: column;
        gap: 4px;
        
        @media screen and (max-width: 768px) {
            &:last-child{
                align-items: flex-end;
                justify-content: flex-end;
                text-align: right;
            }
        }

        @media screen and (max-width: 340px) {
            &:last-child{
                align-items: flex-start;
                justify-content: flex-start;
                text-align: left;
            }
        }

        .compensation__card-thankyou-label {
            font-size: 14px;
            font-weight: 500;
            line-height: normal;
            color: var(--color-blue-900);
        }
        .compensation__card-thankyou-value {
            font-weight: 500;
            line-height: normal;
            color: var(--color-blue-900);

            &.compensation__card-thankyou-value--blue {
                color: var(--color-blue-600);
            }
        }
    }
}

.thankyou-route {
    display: flex;
    justify-content: space-between;
    font-weight: 500;
    align-items: center;
    width: 100%;

    @media screen and (max-width: 768px) {
        padding: var(--sp-2);
        background: linear-gradient(93deg, #F5F7FE 24.08%, #FFF 52.57%, #F5F7FE 81.05%);
        font-size: 14px;
    }

    .thankyou-route__highlight {
        color: var(--color-blue-800);
        font-size: 16px;
    }

    .thankyou-route__city {

    }
    .thankyou-route__plane {
        flex: 1;
        padding: 0 var(--sp-2);
        display: flex;
        align-items: center;
        justify-content: center;
        gap: var(--sp-2);

        &:before, &:after {
            flex: 1;
            content: '';
            height: 1px;
            background: linear-gradient(90deg, #FFF 0%, #B4BDE8 100%);
        }
        &:after {
            background: linear-gradient(90deg,  #B4BDE8 0%, #FFF 100%);
        }

        .thankyou-route__plane-icon {
            width: 32px;
            height: 32px;
            min-width: 32px;
            min-height: 32px;
            border-radius: 50%;
            background: #EEF1FE;
            display: flex;
            align-items: center;
            justify-content: center;

            svg {
                width: 14px;
                height: 12px;
            }
        }
    }
}

.compensation__card-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;

    .compensation__card-list-item {
        list-style: none;
        padding-left: 28px;
        position: relative;

        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .compensation__card-list-item::before {
        content: '';
        position: absolute;
        left: 0;
        top: 4px;
        width: 18px;
        height: 18px;
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none"><path d="M9 1.5C13.1421 1.5 16.5 4.85786 16.5 9C16.5 13.1421 13.1421 16.5 9 16.5C4.85786 16.5 1.5 13.1421 1.5 9C1.5 4.85786 4.85786 1.5 9 1.5Z" fill="%234955C3" stroke="%23B4BDE8"/><path d="M9.00058 16.2912C13.0276 16.2912 16.2922 13.0266 16.2922 8.9996C16.2922 4.97257 13.0276 1.70801 9.00058 1.70801C4.97354 1.70801 1.70898 4.97257 1.70898 8.9996C1.70898 13.0266 4.97354 16.2912 9.00058 16.2912Z" fill="%234955C3" stroke="%23B4BDE8" stroke-width="2"/><path d="M8.99978 13.4996C11.4849 13.4996 13.4996 11.4849 13.4996 8.99978C13.4996 6.51462 11.4849 4.5 8.99978 4.5C6.51462 4.5 4.5 6.51462 4.5 8.99978C4.5 11.4849 6.51462 13.4996 8.99978 13.4996Z" fill="%23FAFBFC"/></svg>');
        background-size: contain;
        background-repeat: no-repeat;
    }

    .compensation__card-list-title {
        font-size: 16px;
        font-weight: 600;
        line-height: normal;

        @media screen and (max-width: 768px){
            font-weight: 500;
        }
    }
    .compensation__card-list-text {
        font-size: 14px;
        font-weight: 400;
        line-height: normal;
        color: #5E699A;
    }
}

.iti__country-list {
    li {
        color: var(--color-blue-900)!important;
    }
}


/* DRAWER (passenger-card) */
.passenger-card-list {
    .passenger-card {
        .passenger-card__section__navigation {
            button.btn {
                max-width: initial;
                width: 100%;
            }
        }
    }
}

#form-loader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 30vh;
    height: 100%;
    z-index: 100;
    background: transparent;

    div {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%);
        background: white;
        padding: 10px;
        font-size: 14px;
        border-radius: 0 6px 6px 6px;
        box-shadow: 0 0 3px #e6e6e6;
        font-weight: 500;
        color: var(--color-blue-900);

        .dots::after {
            content: '';
            display: inline-block;
            width: 1em;
            text-align: left;
            animation: dots 1.2s steps(3, end) infinite;
        }
    }
}
@keyframes dots {
    0%   { content: ''; }
    33%  { content: '.'; }
    66%  { content: '..'; }
    100% { content: '...'; }
}