

/* Start:/local/components/qwelp.shop/contacts/templates/.default/style.css?1769073427868*/
/* Contacts Page Component Styles */
.contacts-page {
    padding-block: var(--section-padding-y);
}

.contacts-page__grid {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 2rem;
    margin-bottom: 3rem;
}

.contacts-page__grid--list-only {
    grid-template-columns: 1fr;
}

.contacts-page__grid--map-only {
    grid-template-columns: 1fr;
}

@media (max-width: 991px) {
    .contacts-page__grid {
        grid-template-columns: 1fr;
    }
}

.contacts-page__info {
    display: flex;
    flex-direction: column;
}

.contacts-page__map {
    display: flex;
    flex-direction: column;
    min-height: 20rem;
}

.contacts-page__form {
    max-width: 40rem;
    margin-inline: auto;
}

/* When there's no grid content, remove margin from form */
.contacts-page__form:first-child {
    margin-bottom: 0;
}

/* End */


/* Start:/local/templates/shop.qwelp.ru/components/bitrix/news.list/contacts/style.css?17690725811799*/
/* Contacts List Component Styles */
.contacts-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.contact-card {
    display: flex;
    gap: 1rem;
    padding: 1.25rem;
    background-color: var(--color-white);
    border-radius: var(--border-radius-m);
    border: var(--border-08);
    transition: box-shadow var(--transition-duration), border-color var(--transition-duration);
}

.contact-card:hover {
    border-color: var(--color-primary-rgba-alpha-20);
    box-shadow: 0 .25rem 1rem var(--color-primary-rgba-alpha-10);
}

.contact-card__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    background-color: var(--color-primary-50);
    border-radius: var(--border-radius-s);
    color: var(--color-primary);
}

.contact-card__content {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.contact-card__title {
    font-size: .875rem;
    font-weight: 600;
    color: var(--color-light-text);
    margin: 0;
    text-transform: uppercase;
    letter-spacing: .03em;
}

.contact-card__link {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--color-title);
    text-decoration: none;
    transition: color var(--transition-duration);
}

.contact-card__link:hover {
    color: var(--color-primary);
}

.contact-card__link--phone {
    font-size: 1.25rem;
}

.contact-card__address {
    font-style: normal;
    font-size: 1rem;
    font-weight: 500;
    color: var(--color-title);
}

.contact-card__text {
    font-size: 1rem;
    color: var(--color-title);
    margin: 0;
}

.contact-card__desc {
    font-size: .875rem;
    color: var(--color-light-text);
    margin: 0;
}

/* End */


/* Start:/local/components/qwelp.shop/contacts.map/templates/.default/style.css?1769073031675*/
/* Contacts Map Component Styles */
.contacts-map {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 20rem;
    border-radius: var(--border-radius-m);
    overflow: hidden;
    border: var(--border-08);
}

.contacts-map__iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.contacts-map__link {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-top: .75rem;
    font-size: .875rem;
    color: var(--color-primary);
    text-decoration: none;
    transition: opacity var(--transition-duration);
}

.contacts-map__link:hover {
    opacity: .8;
}

/* End */


/* Start:/local/components/qwelp.shop/contacts.form/templates/.default/style.css?17690731434086*/
/* Contacts Form Component Styles */
.contacts-form {
    background-color: var(--color-white);
    border-radius: var(--border-radius-l);
    border: var(--border-08);
    padding: 2rem;
}

@media (max-width: 575px) {
    .contacts-form {
        padding: 1.5rem;
    }
}

.contacts-form__header {
    text-align: center;
    margin-bottom: 1.5rem;
}

.contacts-form__title {
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-title);
    margin: 0 0 .5rem;
}

.contacts-form__subtitle {
    font-size: 1rem;
    color: var(--color-light-text);
    margin: 0;
}

/* Form */
.contacts-form__form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.contacts-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

@media (max-width: 575px) {
    .contacts-form__row {
        grid-template-columns: 1fr;
    }
}

.contacts-form__field {
    display: flex;
    flex-direction: column;
    gap: .375rem;
}

.contacts-form__label {
    font-size: .875rem;
    font-weight: 500;
    color: var(--color-title);
}

.contacts-form__required {
    color: var(--color-red);
}

.contacts-form__input,
.contacts-form__textarea {
    width: 100%;
    padding: .75rem 1rem;
    font-size: 1rem;
    font-family: var(--font-family-base);
    color: var(--color-input-text);
    background-color: var(--color-input-bg);
    border: var(--border-width-s) solid var(--color-input-border);
    border-radius: var(--border-radius-xs);
    transition: border-color var(--transition-duration), box-shadow var(--transition-duration);
}

.contacts-form__input:focus,
.contacts-form__textarea:focus {
    outline: none;
    border-color: var(--color-primary);
    box-shadow: 0 0 0 .1875rem var(--color-primary-rgba-alpha-15);
}

.contacts-form__input::placeholder,
.contacts-form__textarea::placeholder {
    color: var(--color-input-placeholder);
}

.contacts-form__textarea {
    min-height: 7rem;
    resize: vertical;
    line-height: 1.5;
}

/* Captcha */
.contacts-form__captcha-wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.contacts-form__captcha-image {
    height: 2.5rem;
    border-radius: var(--border-radius-xs);
}

.contacts-form__captcha-input {
    flex: 1;
    max-width: 10rem;
}

/* Footer */
.contacts-form__footer {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-top: .5rem;
}

.contacts-form__privacy {
    font-size: .8125rem;
    color: var(--color-light-text);
    text-align: center;
    margin: 0;
}

.contacts-form__submit {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: .5rem;
    width: 100%;
    padding: .875rem 1.5rem;
    font-size: 1rem;
    font-weight: 500;
    font-family: var(--font-family-base);
    color: var(--color-white);
    background-color: var(--color-primary);
    border: none;
    border-radius: var(--border-radius-xs);
    cursor: pointer;
    transition: background-color var(--transition-duration), transform var(--transition-duration);
}

.contacts-form__submit:hover {
    background-color: var(--color-primary-700);
}

.contacts-form__submit:active {
    transform: scale(.98);
}

.contacts-form__submit svg {
    flex-shrink: 0;
}

/* Success & Error messages */
.contacts-form__success,
.contacts-form__error {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1rem 1.25rem;
    border-radius: var(--border-radius-xs);
    font-size: .9375rem;
}

.contacts-form__success {
    background-color: rgba(50, 192, 17, .1);
    border: var(--border-width-s) solid var(--color-green);
    color: var(--color-green);
}

.contacts-form__error {
    background-color: rgba(220, 38, 38, .1);
    border: var(--border-width-s) solid var(--color-red);
    color: var(--color-red);
    margin-bottom: 1rem;
}

.contacts-form__success svg,
.contacts-form__error svg {
    flex-shrink: 0;
}

/* End */
/* /local/components/qwelp.shop/contacts/templates/.default/style.css?1769073427868 */
/* /local/templates/shop.qwelp.ru/components/bitrix/news.list/contacts/style.css?17690725811799 */
/* /local/components/qwelp.shop/contacts.map/templates/.default/style.css?1769073031675 */
/* /local/components/qwelp.shop/contacts.form/templates/.default/style.css?17690731434086 */
