@use './src/styles/colors' as *;

:host {
    background: $white;
    display: flex;

    .status--text-center {
        display: flex;
        padding-right: 32px;
        margin-left: -100%;
        overflow: visible;
        justify-content: center;
    }

    .status--text-right {
        margin-left: auto;
        text-align: right;
    }

    .status--text-left {
        margin-right: auto;
        text-align: left;
    }
}

.flight-route {
    &__in-flight-status {
        display: flex;
        overflow: visible;
        justify-content: flex-end;
    }

    &__in-flight-status-text {
        position: relative;
        right: calc(-50% + 16px);
    }

    &__in-flight-status-text-container {
        display: flex;
    }
}

.flight-route__in-flight-status--right {
    .flight-route__in-flight-status-text {
        right: 0;
    }
}
