/*
 * Therapy Landing Pro - Isolated UI Layer
 * Scope all interactive controls to plugin sections only.
 */

.tlp-app .tlp-ui-isolate :where(button, input, textarea, select) {
    font: inherit;
    letter-spacing: inherit;
}

.tlp-app .tlp-ui-isolate :where(button) {
    -webkit-appearance: none;
    appearance: none;
    margin-bottom: 0 !important;
}

.tlp-app .tlp-ui-isolate :where(input, textarea, select) {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0.75rem;
}

.tlp-app .tlp-ui-isolate :where(button, input, textarea, select):focus-visible {
    outline: 2px solid color-mix(in srgb, var(--tlp-primary, #059669) 46%, #ffffff);
    outline-offset: 1px;
}

.tlp-app .tlp-ui-isolate .tlp-faq-modern-list {
    gap: 0.92rem;
}

.tlp-app .tlp-ui-isolate .tlp-faq-modern-item {
    border: 1px solid color-mix(in srgb, var(--tlp-primary, #059669) 24%, #dbe5df);
    background: linear-gradient(155deg, #ffffff 0%, color-mix(in srgb, var(--tlp-primary-tint, #ecfdf5) 42%, #ffffff) 100%);
    box-shadow: 0 16px 34px -28px rgba(15, 23, 42, 0.38);
}

.tlp-app .tlp-ui-isolate .tlp-faq-modern-item:hover {
    border-color: color-mix(in srgb, var(--tlp-primary, #059669) 48%, #cbd5e1);
}

.tlp-app .tlp-ui-isolate .tlp-faq-modern-question {
    color: color-mix(in srgb, var(--tlp-text-main, #0f172a) 90%, #000000);
    font-weight: 650;
}

.tlp-app .tlp-ui-isolate .tlp-faq-modern-text {
    color: #374151;
}

.tlp-app .tlp-ui-isolate .tlp-faq-answer {
    color: #374151;
}

.tlp-app .tlp-ui-isolate .tlp-faq-modern-answer-inner {
    padding: 0px;
}

.tlp-app .tlp-ui-isolate .tlp-form-wrapper,
.tlp-app .tlp-ui-isolate .tlp-review-form {
    isolation: isolate;
}

.tlp-app .tlp-ui-isolate .tlp-form-input,
.tlp-app .tlp-ui-isolate .tlp-review-input {
    background: #ffffff;
    border: 1px solid color-mix(in srgb, var(--tlp-primary, #059669) 18%, #cbd5e1);
    color: var(--tlp-text-main, #0f172a);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.tlp-app .tlp-ui-isolate .tlp-form-input::placeholder,
.tlp-app .tlp-ui-isolate .tlp-review-input::placeholder {
    color: color-mix(in srgb, var(--tlp-text-muted, #64748b) 86%, #ffffff);
}

.tlp-app .tlp-ui-isolate .tlp-form-input:focus,
.tlp-app .tlp-ui-isolate .tlp-review-input:focus {
    background: color-mix(in srgb, var(--tlp-primary-tint, #ecfdf5) 30%, #ffffff);
    border-color: color-mix(in srgb, var(--tlp-primary, #059669) 55%, #ffffff);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--tlp-primary, #059669) 22%, transparent);
}

.tlp-app .tlp-ui-isolate .tlp-form-submit-btn,
.tlp-app .tlp-ui-isolate .tlp-review-submit-btn,
.tlp-app .tlp-ui-isolate .tlp-faq-modern-btn,
.tlp-app .tlp-ui-isolate .tlp-review-page-btn,
.tlp-app .tlp-ui-isolate .tlp-rating-star,
.tlp-app .tlp-ui-isolate .tlp-gallery-card,
.tlp-app .tlp-ui-isolate .tlp-short-video-item {
    font-family: inherit;
}

.tlp-app .tlp-ui-isolate .tlp-form-submit-btn,
.tlp-app .tlp-ui-isolate .tlp-review-submit-btn {
    background: linear-gradient(135deg, color-mix(in srgb, var(--tlp-primary, #059669) 92%, #ffffff), color-mix(in srgb, var(--tlp-primary-dark, #065f46) 84%, #0f172a));
    box-shadow: 0 14px 30px -18px color-mix(in srgb, var(--tlp-primary, #059669) 48%, rgba(15, 23, 42, 0.18));
    border: 1px solid color-mix(in srgb, var(--tlp-primary, #059669) 48%, transparent);
}

.tlp-app .tlp-ui-isolate .tlp-form-submit-btn:hover,
.tlp-app .tlp-ui-isolate .tlp-review-submit-btn:hover {
    transform: translateY(-1px);
    filter: saturate(1.06);
}

.tlp-app .tlp-ui-isolate .tlp-gallery-card {
    border: 1px solid color-mix(in srgb, var(--tlp-primary, #059669) 18%, #dbeafe);
    background: #f8fafc;
}

.tlp-app .tlp-ui-isolate .tlp-gallery-card:hover {
    box-shadow: 0 16px 28px -20px color-mix(in srgb, var(--tlp-primary, #059669) 40%, rgba(15, 23, 42, 0.2));
}

@media (max-width: 768px) {
    .tlp-app .tlp-ui-isolate .tlp-faq-modern-text {
        font-size: 16px;
        line-height: 1.7;
    }

    .tlp-app .tlp-ui-isolate .tlp-faq-modern-question {
        font-size: 0.92rem;
        text-transform: capitalize;
    }

    .tlp-app .tlp-ui-isolate .tlp-form-submit-btn,
    .tlp-app .tlp-ui-isolate .tlp-review-submit-btn {
        min-height: 42px;
    }
}
