/* Ajuste visual del formulario de incidencias para igualarlo al formulario de avisos. */

.incidencias-card--form {
    background: var(--surface-card) !important;
    border: 1px solid var(--surface-elevated-card) !important;
    border-radius: .95rem !important;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .08) !important;
    overflow: hidden !important;
}

.incidencias-card--form .card-header {
    display: none !important;
}

.incidencias-card--form .card-body {
    padding: 1rem !important;
}

.incidencias-form .row.g-3 {
    --bs-gutter-y: 1.05rem;
}

.incidencias-form .form-label {
    color: var(--color-cool-gray) !important;
    font-size: .85rem !important;
    font-weight: 500 !important;
    margin-bottom: .42rem !important;
}

.incidencias-form .form-control,
.incidencias-form .form-select,
.incidencias-form .e-control-wrapper,
.incidencias-form .e-input-group {
    background-color: var(--surface-section-bg) !important;
    border: 1px solid var(--surface-elevated-card) !important;
    border-radius: .75rem !important;
    box-shadow: none !important;
    color: var(--color-off-white) !important;
    min-height: 2.45rem !important;
}

.incidencias-form .e-input-group.e-control-wrapper,
.incidencias-form .e-control-wrapper.e-ddl,
.incidencias-form .e-control-wrapper.e-combobox {
    padding-inline: .15rem !important;
}

.incidencias-form .e-input,
.incidencias-form .e-input-group .e-input,
.incidencias-form .e-control-wrapper .e-input,
.incidencias-form .e-dropdownlist,
.incidencias-form .e-combobox {
    background: transparent !important;
    color: var(--color-off-white) !important;
    font-size: .95rem !important;
    min-height: 2.28rem !important;
}

.incidencias-form .e-input-group-icon,
.incidencias-form .e-ddl-icon,
.incidencias-form .e-ddl-icon::before {
    color: var(--color-cool-gray) !important;
}

.incidencias-form .form-control:focus,
.incidencias-form .form-select:focus,
.incidencias-form .e-control-wrapper.e-input-focus,
.incidencias-form .e-input-group.e-input-focus,
.incidencias-form .e-control-wrapper:focus-within,
.incidencias-form .e-input-group:focus-within {
    border-color: var(--color-mustotal-blue) !important;
    box-shadow: 0 0 0 .15rem rgba(0, 162, 232, .18) !important;
}

.incidencias-form .form-control::placeholder,
.incidencias-form .e-input::placeholder,
.incidencias-form .e-control-wrapper .e-input::placeholder,
.incidencias-form .e-input-group .e-input::placeholder {
    color: var(--color-cool-gray) !important;
    opacity: 1 !important;
}

.incidencias-form .incidencias-descripcion {
    background-color: var(--surface-section-bg) !important;
    min-height: 8.5rem !important;
    padding: .68rem .78rem !important;
    resize: vertical;
}

.incidencias-form .validation-message,
.incidencias-form .text-danger,
.incidencias-form .alert-warning {
    color: var(--color-draw-amber) !important;
}

.incidencias-form .alert-warning {
    background: transparent !important;
    border: 0 !important;
    padding-inline: 0 !important;
}

.incidencias-form-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .75rem !important;
    justify-content: flex-start !important;
}

.incidencias-form-actions .btn {
    border-radius: .7rem !important;
    font-size: .95rem !important;
    font-weight: 500 !important;
    min-height: 2.55rem !important;
    padding: .42rem 1rem !important;
}

.incidencias-form-actions .btn.btn-primary {
    background: var(--color-mustotal-blue) !important;
    border-color: var(--color-mustotal-blue) !important;
    color: var(--color-logo-white) !important;
}

.incidencias-form-actions .btn.btn-primary:hover,
.incidencias-form-actions .btn.btn-primary:focus-visible {
    background: var(--color-sky-blue) !important;
    border-color: var(--color-sky-blue) !important;
    color: var(--color-logo-white) !important;
}

.incidencias-form-actions .btn.btn-outline-secondary {
    background: transparent !important;
    border-color: var(--surface-elevated-card) !important;
    color: var(--color-cool-gray) !important;
}

.incidencias-form-actions .btn.btn-outline-secondary:hover,
.incidencias-form-actions .btn.btn-outline-secondary:focus-visible {
    background: var(--surface-blue-tint) !important;
    border-color: rgba(0, 162, 232, .32) !important;
    color: var(--color-off-white) !important;
}

@media (max-width: 767.98px) {
    .incidencias-card--form .card-body {
        padding: .9rem !important;
    }

    .incidencias-form .row.g-3 {
        --bs-gutter-y: 1rem;
    }

    .incidencias-form .form-label {
        font-size: .84rem !important;
    }

    .incidencias-form .form-control,
    .incidencias-form .form-select,
    .incidencias-form .e-control-wrapper,
    .incidencias-form .e-input-group {
        min-height: 2.45rem !important;
    }

    .incidencias-form .incidencias-descripcion {
        min-height: 8.5rem !important;
    }

    .incidencias-form-actions {
        align-items: stretch !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    }

    .incidencias-form-actions .btn {
        width: 100% !important;
    }
}