@import '../../../styles/variables';
@import '../../../styles/mixins';

.dc-search-page {
    margin-top: 26px;
    display: flex;
    justify-content: center;

    &__layout {
        max-width: $centerBlockMaxWidth;
        width: 100%;
    }

    &__search-field-wrapper {
        display: flex;
        align-items: center;
    }

    &__search-button {
        margin-left: 10px;
    }

    &__search {
        &-field,
        &-item {
            margin-bottom: 36px;
        }
    }

    &__subtitle {
        margin-bottom: 18px;
    }

    &__paginator {
        padding: 10px 0;
        border-top: 1px solid var(--yc-color-line-generic);
    }

    @media (max-width: map-get($screenBreakpoints, 'md')) {
        margin-top: 16px;

        &__layout {
            padding: 0 12px;
        }

        &__search {
            &-field {
                margin-bottom: 24px;
            }

            &-item {
                margin-bottom: 40px;
            }
        }
    }
}