/**
 * Contact Form Styles - Специальные стили для формы обращения
 * Дополнительные стили для формы "Обращение на получение помощи"
 */

/* Контейнер формы обращения */
.page-template-default .quform-form,
.single .quform-form,
.page .quform-form {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 3rem;
    background: #ffffff;
    border-radius: 0;
    box-shadow: none;
    border: none;
}

/* Заголовок формы */
.quform-form::before {
    content: "Форма обращения";
    display: block;
    font-size: 24px;
    font-weight: 700;
    color: #1f2937;
    text-align: center;
    margin-bottom: 2rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid rgba(34, 139, 34, 0.2);
}

/* SVG иконки для полей формы */
.quform-element-1_3 .quform-label-text {
    position: relative;
    padding-left: 24px;
}

.quform-element-1_3 .quform-label-text::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>') no-repeat center;
    background-size: contain;
    opacity: 0.7;
}

.quform-element-1_4 .quform-label-text {
    position: relative;
    padding-left: 24px;
}

.quform-element-1_4 .quform-label-text::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"/><circle cx="12" cy="10" r="3"/></svg>') no-repeat center;
    background-size: contain;
    opacity: 0.7;
}

.quform-element-1_5 .quform-label-text {
    position: relative;
    padding-left: 24px;
}

.quform-element-1_5 .quform-label-text::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/></svg>') no-repeat center;
    background-size: contain;
    opacity: 0.7;
}

.quform-element-1_7 .quform-label-text {
    position: relative;
    padding-left: 24px;
}

.quform-element-1_7 .quform-label-text::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>') no-repeat center;
    background-size: contain;
    opacity: 0.7;
}

.quform-element-1_8 .quform-label-text {
    position: relative;
    padding-left: 24px;
}

.quform-element-1_8 .quform-label-text::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66L9.64 16.2a2 2 0 0 1-2.83-2.83l8.49-8.49"/></svg>') no-repeat center;
    background-size: contain;
    opacity: 0.7;
}

/* Улучшенные стили для textarea */
.quform-field-textarea {
    min-height: 150px !important;
    font-family: 'Jost', sans-serif !important;
    line-height: 1.6 !important;
    resize: vertical !important;
}

/* Стили для файлового поля */
.quform-upload-button {
    width: 100% !important;
    min-height: 80px !important;
    border: 3px dashed #d1d5db !important;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%) !important;
    border-radius: 12px !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
}

.quform-upload-button::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(34, 139, 34, 0.1), transparent);
    transition: left 0.5s ease;
}

.quform-upload-button:hover::before {
    left: 100%;
}

.quform-upload-button:hover {
    border-color: #228B22 !important;
    background: linear-gradient(135deg, #f0f9f0 0%, #e8f5e8 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(34, 139, 34, 0.2) !important;
}

.quform-upload-button-text {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: #374151 !important;
}

.quform-upload-button:hover .quform-upload-button-text {
    color: #228B22 !important;
}

.quform-upload-button-icon {
    font-size: 24px !important;
    color: #6b7280 !important;
    transition: all 0.3s ease !important;
}

.quform-upload-button:hover .quform-upload-button-icon {
    color: #228B22 !important;
    transform: scale(1.2) !important;
}

/* Стили для чекбокса согласия */
.quform-element-1_9 {
    background: rgba(34, 139, 34, 0.05) !important;
    padding: 20px !important;
    border-radius: 12px !important;
    border: 2px solid rgba(34, 139, 34, 0.2) !important;
    margin: 2rem 0 !important;
}

.quform-element-1_9 .quform-option-label {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #374151 !important;
    line-height: 1.5 !important;
}

.quform-element-1_9 .quform-field-checkbox {
    width: 20px !important;
    height: 20px !important;
    margin-right: 16px !important;
    accent-color: #228B22 !important;
}

/* Улучшенная кнопка отправки */
.quform-submit {
    background: linear-gradient(135deg, #228B22 0%, #32CD32 100%) !important;
    padding: 20px 40px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    border-radius: 12px !important;
    box-shadow: 0 6px 20px rgba(34, 139, 34, 0.4) !important;
    position: relative !important;
    overflow: hidden !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.quform-submit::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s ease;
}

.quform-submit:hover::before {
    left: 100%;
}

.quform-submit:hover {
    background: linear-gradient(135deg, #1e7a1e 0%, #2eb82e 100%) !important;
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 30px rgba(34, 139, 34, 0.5) !important;
}

.quform-submit:active {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(34, 139, 34, 0.4) !important;
}

/* Анимация отправки */
.quform-submit.quform-submitting {
    background: linear-gradient(135deg, #6b7280 0%, #9ca3af 100%) !important;
    cursor: not-allowed !important;
    transform: none !important;
}

.quform-submit.quform-submitting::after {
    content: "Отправка...";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #ffffff;
    font-weight: 600;
}

.quform-submit.quform-submitting .quform-button-submit-text {
    opacity: 0;
}

/* Сообщения об успехе и ошибках */
.quform-success-message {
    background: linear-gradient(135deg, #dcfce7 0%, #bbf7d0 100%) !important;
    border: 2px solid #22c55e !important;
    color: #15803d !important;
    padding: 24px !important;
    border-radius: 12px !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    text-align: center !important;
    margin: 2rem 0 !important;
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.2) !important;
}

.quform-success-message::before {
    content: "";
    font-size: 24px;
    margin-right: 8px;
}

.quform-error-message {
    background: linear-gradient(135deg, #fef2f2 0%, #fecaca 100%) !important;
    border: 2px solid #ef4444 !important;
    color: #dc2626 !important;
    padding: 20px !important;
    border-radius: 12px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 1rem 0 !important;
    box-shadow: 0 4px 12px rgba(239, 68, 68, 0.2) !important;
}

.quform-error-message::before {
    content: "";
    font-size: 20px;
    margin-right: 8px;
}

/* Индикатор обязательных полей */
.quform-element-required .quform-label-text::after {
    content: " *";
    color: #dc2626;
    font-weight: 700;
}

/* Подсказки для полей */
.quform-element-1_3 .quform-field::placeholder {
    content: "Введите ваше имя и фамилию";
}

.quform-element-1_4 .quform-field::placeholder {
    content: "Укажите ваш город";
}

.quform-element-1_5 .quform-field::placeholder {
    content: "+7 (___) ___-__-__";
}

.quform-element-1_7 .quform-field::placeholder {
    content: "Опишите подробно вашу ситуацию, какая помощь вам нужна...";
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
    .page-template-default .quform-form,
    .single .quform-form,
    .page .quform-form {
        margin: 0;
        padding: 2rem 1.5rem;
        width: 100%;
    }
    
    .quform-form::before {
        font-size: 20px;
        margin-bottom: 1.5rem;
    }
    
    .quform-upload-button {
        min-height: 60px !important;
    }
    
    .quform-upload-button-text {
        font-size: 16px !important;
    }
    
    .quform-submit {
        width: 100% !important;
        padding: 18px 24px !important;
        font-size: 16px !important;
    }
}

@media (max-width: 480px) {
    .page-template-default .quform-form,
    .single .quform-form,
    .page .quform-form {
        margin: 0;
        padding: 1.5rem 1rem;
        width: 100%;
    }
    
    .quform-element {
        margin-bottom: 20px !important;
    }
    
    .quform-field {
        font-size: 16px !important; /* Предотвращает зум на iOS */
    }
}

/* Анимация появления формы */
.quform-form {
    opacity: 0;
    transform: translateY(30px);
    animation: form-appear 0.8s ease forwards;
}

@keyframes form-appear {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Убираем фокус с полей ввода */
.quform-field:focus {
    outline: none !important;
    box-shadow: none !important;
}

.quform-field:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

.quform-submit:focus {
    outline: none !important;
    box-shadow: none !important;
}

.quform-submit:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

/* Конец файла */