@use '../utils' as *;

.tpcoming {
    &__bg {
        background-repeat: no-repeat;
    }

    &__area {
        padding-top: 80px;
    }

    &__countdown {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6rem;

        @media (max-width: 991px) {
            gap: 2rem;
        }

        & span {
            &.cdown {
                background-color: transparent;
                height: 100%;
                width: 60px;
                text-align: center;
                color: var(--tp-common-white);
                font-size: 48px;
                font-weight: 700;
                margin-bottom: 40px;
            }

            & p {
                margin-top: 10px;
                color: var(--tp-common-white);
            }
        }
    }

    &__content {
        padding-top: 280px;

        & span {
            margin-bottom: 5px;
            display: inline-block;
            font-size: 18px;
            color: var(--tp-common-white);
        }
    }

    &__title {
        font-weight: 600;
        color: var(--tp-common-white);
        font-size: 48px;
    }

    &__submit {
        & form {
            position: relative;

            & input {
                height: 60px;
                width: 100%;
                border: none;
                padding: 5px 200px 5px 55px;

                &::placeholder {
                    font-size: 14px;
                    color: var(--tp-text-secondary);
                }
            }
        }

        & span {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            inset-inline-start: 30px;
        }

        & button {
            position: absolute;
            font-size: 16px;
            color: var(--tp-common-white);
            font-weight: 600;
            inset-inline-end: -1px;
            top: 50%;
            transform: translateY(-50%);
            background: var(--tp-text-primary);
            padding: 17px 20px;

            & i {
                margin-inline-start: 11px;
            }
        }
    }
}