@use 'sass:math';
@use './src/styles/colors' as *;
@use './src/styles/variables' as *;
@use './src/styles/fonts' as *;
@use './src/styles/screen' as *;
@use './src/styles/layouts' as *;

:host {
    padding: 0 !important;
    margin-right: 0 !important;

    .flight-options-icon__icon {
        align-items: flex-start;

        padding-top: $space-m;
        height: 100%;
        border-right: 1px solid $border;
    }

    .transfer-info {
        display: flex;
        flex-wrap: wrap;
        align-items: center;

        padding: $space-s $space-m;

        span {
            @include font-small();
            @include font-overflow();

            &.embolded {
                font-weight: $font-bold;
            }
        }

        .multi-transfers {
            display: flex;

            @include h-spacing($space-s);
        }

        .dash {
            @include mobile {
                display: none;
            }
        }

        @include h-spacing($space-s);

        @include mobile() {
            flex-direction: column;
            align-items: flex-start;
            overflow: hidden;
            flex: 1;

            @include v-spacing($space-s);
        }
    }

    @include mobile() {
        width: 100% !important;
    }
}
