/**
 * Общие стили форм (Vue + Element Plus) и тема модуля.
 * Подключается в форме проектов и в детальных формах админки (типы объектов, ценовые регионы).
 */

/* Контейнеры Vue-форм в админке */
#pm-object-types-app,
#pm-price-regions-app {
    display: block;
    margin-top: 16px;
}

/* ——— Тема Element Plus: основной цвет (как в проектах) ——— */
:root {
    --el-color-primary: #f55536;
    --el-color-primary-light-3: #e04a2d;
    --el-color-primary-dark-2: #e04a2d;
}
/* Кнопка primary в формах */
.projects-form .el-button--primary,
.pm-detail-form .el-button--primary {
    --el-button-bg-color: #f55536;
    --el-button-border-color: #f55536;
    --el-button-text-color: #fff;
}
.projects-form .el-button--primary:hover,
.projects-form .el-button--primary:focus,
.pm-detail-form .el-button--primary:hover,
.pm-detail-form .el-button--primary:focus {
    --el-button-bg-color: #e04a2d;
    --el-button-border-color: #e04a2d;
    --el-button-text-color: #fff;
}

/* ——— Общая секция формы ——— */
.projects-form__section,
.pm-detail-form__section {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e8e8e8;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    padding: 32px 40px 40px;
    overflow-x: hidden;
}

/* ——— Блок кнопок ——— */
.projects-form__actions,
.pm-detail-form__actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 32px;
    padding-top: 24px;
}
.pm-detail-form__actions a.el-button {
    text-decoration: none;
}

/* ——— Поля Element Plus (input, select) ——— */
.projects-form .el-input__wrapper,
.projects-form .el-select .el-input__wrapper,
.pm-detail-form .el-input__wrapper,
.pm-detail-form .el-select .el-input__wrapper {
    border-radius: 4px;
    border: 1px solid #d9d9d9;
    box-shadow: none;
    background: #fff;
}
.projects-form .el-input__wrapper:hover,
.projects-form .el-select .el-input__wrapper:hover,
.pm-detail-form .el-input__wrapper:hover,
.pm-detail-form .el-select .el-input__wrapper:hover {
    border-color: #40a9ff;
}
.projects-form .el-input__wrapper.is-focus,
.projects-form .el-select .el-input.is-focus .el-input__wrapper,
.pm-detail-form .el-input__wrapper.is-focus,
.pm-detail-form .el-select .el-input.is-focus .el-input__wrapper {
    border-color: #40a9ff;
    box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.1);
}

/* ——— Лейблы и form-item ——— */
.projects-form .el-form-item__label,
.pm-detail-form .el-form-item__label {
    color: rgba(0, 0, 0, 0.85);
    font-size: 14px;
}
.projects-form .el-form-item__label .el-form-item__required,
.pm-detail-form .el-form-item__label .el-form-item__required {
    color: #f5222d;
}
.projects-form .el-form-item,
.pm-detail-form .el-form-item {
    margin-bottom: 0;
    min-width: 0;
}
.projects-form .el-input,
.projects-form .el-select,
.pm-detail-form .el-input,
.pm-detail-form .el-select {
    width: 100%;
    min-width: 0;
}
.projects-form .el-input .el-input__wrapper,
.pm-detail-form .el-input .el-input__wrapper {
    min-width: 0;
}

/* ——— Адаптив ——— */
@media (max-width: 768px) {
    .projects-form__section,
    .pm-detail-form__section {
        padding: 20px 16px 24px;
    }
    .projects-form__actions,
    .pm-detail-form__actions {
        margin-top: 24px;
    }
    .projects-form__actions .el-button,
    .pm-detail-form__actions .el-button {
        width: 100%;
    }
}
