/**
 * Third-party frontend integration layer.
 *
 * Plugin PHP/JS files are never modified. Only wrapper-safe and confirmed
 * stable selectors are used here. Amelia fine tuning must be verified against
 * the rendered DOM after every Amelia update.
 */

/* Amelia wrappers */
.amelia-list-panel,
.course-panel--booking-page,
.course-panel--booking {
    --sp-integration-accent: var(--sp-yellow-500);
    --sp-integration-focus: var(--sp-blue-700);
}

.amelia-list-panel > *,
.course-panel--booking > *,
.course-panel--booking-page > * {
    max-width: 100%;
}

.amelia-list-panel :where(button, input, select, textarea),
.course-panel--booking :where(button, input, select, textarea),
.course-panel--booking-page :where(button, input, select, textarea) {
    font-family: var(--sp-font-sans);
}

/* Keep plugin widgets from forcing horizontal overflow on small screens. */
.amelia-list-panel,
.course-panel--booking,
.course-panel--booking-page,
.amelia-list-panel :where(div, section),
.course-panel--booking :where(div, section),
.course-panel--booking-page :where(div, section) {
    min-width: 0;
}

/* Fluent Forms - stable public classes, scoped to the contact template. */
.contact-panel .fluentform {
    font-family: var(--sp-font-sans);
}

.contact-panel .fluentform .ff-el-group {
    margin-bottom: var(--sp-space-5);
}

.contact-panel .fluentform .ff-el-input--label label {
    margin-bottom: 7px;
    color: var(--sp-ink-900);
    font-size: 0.88rem;
    font-weight: 700;
}

.contact-panel .fluentform .ff-el-form-control {
    min-height: 48px;
    padding: 11px 13px;
    background: var(--sp-white);
    color: var(--sp-ink-900);
    border: 1px solid var(--sp-border-strong);
    border-radius: 10px;
    box-shadow: none;
}

.contact-panel .fluentform textarea.ff-el-form-control {
    min-height: 150px;
}

.contact-panel .fluentform .ff-el-form-control:focus {
    border-color: var(--sp-blue-700);
    box-shadow: 0 0 0 4px rgba(1, 104, 142, 0.12);
}

.contact-panel .fluentform .ff-btn-submit {
    min-height: 48px;
    padding: 11px 22px;
    background: var(--sp-yellow-500);
    color: var(--sp-ink-950);
    border: 1px solid var(--sp-yellow-500);
    border-radius: 10px;
    font-weight: 750;
}

.contact-panel .fluentform .ff-btn-submit:hover {
    background: var(--sp-yellow-600);
    border-color: var(--sp-yellow-600);
}

.contact-panel .fluentform .ff-el-is-error .ff-el-form-control {
    border-color: var(--sp-error);
}

.contact-panel .fluentform .error.text-danger,
.contact-panel .fluentform .ff-el-is-error .text-danger {
    color: var(--sp-error);
    font-size: 0.82rem;
}

.contact-panel .fluentform .ff-message-success {
    padding: var(--sp-space-4);
    background: rgba(47, 125, 85, 0.08);
    color: var(--sp-success);
    border: 1px solid rgba(47, 125, 85, 0.25);
    border-radius: var(--sp-radius-sm);
}