.transformations_loader_overlay {
    position: fixed;
    inset: 0;
    background: rgba(11, 52, 102, 0.65);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

/* Insights listing filters only — match Add Insight button height; do not affect edit-page selects. */
.insights_listing_filters_form {
    margin-bottom: 12px;
}

.insights_listing_filters_row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 16px;
    align-items: flex-end;
    width: 100%;
    box-sizing: border-box;
}

.insights_listing_filter_field {
    flex: 1;
    min-width: 220px;
    max-width: 360px;
}

.insights_listing_filter_label {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    font-weight: 600;
    color: #364153;
}

.insights_listing_filter_actions {
    flex: 0 0 auto;
}

/* Same box model as global admin buttons (Add Insight): padding 4px 10px, font-size 16px, 1px border. */
#admin_insights_page .insights_listing_filters_form .edit_section_content_item_value_select {
    height: auto;
    min-height: 0;
    padding: 4px 36px 4px 10px;
    font-size: 16px;
    font-weight: 500;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: normal;
    border-radius: 3px;
    border: 1px solid gray;
    box-sizing: border-box;
}

#admin_insights_page .insights_listing_filters_form .edit_section_content_item_select_icon_container {
    width: 20px;
    height: 20px;
    right: 5px;
    top: 15px;
}

#admin_insights_page .insights_listing_filters_form .edit_section_content_item_select_icon {
    height: 12px;
    font-size: 12px;
    line-height: 1;
}

#admin_insights_page .insights_listing_filters_form #insights_listing_filter_btn {
    min-height: 0;
    height: auto;
    padding: 4px 10px;
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    border-radius: 3px;
    box-sizing: border-box;
    margin-bottom: 3px;
}

.insights_listing_table {
    table-layout: fixed;
    width: 100%;
}

.insights_listing_table th,
.insights_listing_table td {
    overflow: hidden;
    vertical-align: middle;
}

.insights_listing_cell_ellipsis {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.insights_listing_col_id {
    width: 225px;
}

.insights_listing_col_name {
    width: 17%;
}

.insights_listing_col_primary,
.insights_listing_col_secondary {
    width: 14%;
}

.insights_listing_col_status {
    width: 150px;
}

.insights_listing_col_added_by {
    width: 180px;
}

.insights_listing_col_added_at {
    width: 220px;
}

/* Generated Insights listing */
/* The wide table scrolls inside its own container so the page header (and its
   action buttons) never scroll horizontally with it. */
.insights_generation_generated_listing_scroll {
    max-width: 100%;
    overflow-x: auto;
}

/* Every column below is fixed width except Error, which stays auto so fixed
   table layout gives all the leftover width to Error alone instead of spreading
   it across every column. min-width is the fixed columns plus a floor for Error
   (and cell padding/borders), so Error stays readable on narrow screens — keep
   it in sync when the column widths below change. */
.insights_generation_generated_listing_table {
    table-layout: fixed;
    width: 100%;
    min-width: 1890px;
}

/* Header labels truncate like cell values; hover tooltip reveals the full label. */
.insights_generation_generated_listing_table th.tooltip_hover {
    cursor: default;
}

.insights_generation_generated_col_id {
    width: 360px;
    min-width: 360px;
}

.insights_generation_generated_id_text {
    white-space: nowrap;
    overflow: visible;
}

.insights_generation_generated_id_link {
    color: inherit;
    text-decoration: underline !important;
}

.insights_generation_generated_col_primary,
.insights_generation_generated_col_secondary {
    width: 152px;
}

.insights_generation_generated_col_status {
    width: 130px;
    min-width: 120px;
}

.insights_generation_generated_col_insights {
    width: 80px;
    min-width: 70px;
}

.insights_generation_generated_col_input_tokens,
.insights_generation_generated_col_output_tokens {
    width: 110px;
    min-width: 100px;
}

/* Error absorbs any width beyond the fixed columns. */
.insights_generation_generated_col_error {
    width: auto;
    min-width: 160px;
}

.insights_generation_generated_listing_table td.insights_generation_generated_col_error {
    max-width: none;
}

.insights_generation_generated_col_created_by {
    width: 200px;
    min-width: 180px;
}

.insights_generation_generated_col_created_at {
    width: 220px;
}

.insights_generation_generated_listing_table td.insights_generation_generated_col_created_at {
    max-width: none;
    white-space: nowrap;
}

.insights_generation_generated_insights_open {
    cursor: pointer;
    text-decoration: underline;
}

.insights_generation_generated_insights_modal .insights_generation_generated_insights_modal_content {
    max-width: 560px;
    width: 92%;
    max-height: 80vh;
}

.insights_generation_generated_insights_modal_run_id {
    margin: 0 0 12px;
    font-size: 14px;
    color: #555;
    word-break: break-all;
}

.insights_generation_generated_insights_modal_list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 50vh;
    overflow-y: auto;
}

.insights_generation_generated_insights_modal_item {
    margin: 0;
    padding: 8px 0;
    border-bottom: 1px solid #eee;
    font-size: 14px;
    word-break: break-all;
}

.insights_generation_generated_insights_modal_item:last-child {
    border-bottom: none;
}

.insights_generation_generated_insights_modal_item a {
    color: #1976D2;
    text-decoration: none;
}

.insights_generation_generated_insights_modal_item a:hover {
    text-decoration: underline;
}

.insights_generation_generated_insights_modal .insights_generation_generated_insights_modal_body {
    padding-bottom: 20px;
}

.transformations_loader_overlay.is-visible {
    display: flex;
}

.transformations_loader_content {
    text-align: center;
    color: #ffffff;
    font-size: 16px;
}

.transformations_loader_spinner {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(255,255,255,0.3);
    border-top-color: #7ab8ff;
    border-radius: 50%;
    margin: 0 auto 12px;
    animation: transformations_loader_spin 1s linear infinite;
}

.transformations_loader_text {
    font-weight: 600;
    letter-spacing: .5px;
}

.btn-loading {
    opacity: .8;
    position: relative;
}

.btn-loading::after {
    content: '';
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255,255,255,0.6);
    border-top-color: transparent;
    border-radius: 50%;
    display: inline-block;
    margin-left: 8px;
    vertical-align: middle;
    animation: transformations_loader_spin .8s linear infinite;
}

@keyframes transformations_loader_spin {
    to {
        transform: rotate(360deg);
    }
}

/**
 * Edit Page - Outermost Container Styles
 * Matching Figma design specifications for the main form container
 */

/* Edit form container - matching Figma design */
form.edit_form {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 55px;
}

form.insight_edit_form {
    margin-bottom: 55px;
}

/* SEO prompt edit only — clearance for fixed .edit_actions_container footer. */
#admin_seo_prompt_edit_page form.seo_prompt_edit_form {
    margin-bottom: 80px;
}

/* Insights generation prompt edit — clearance for fixed .edit_actions_container footer. */
#admin_insights_generation_prompt_edit_page form.insights_generation_prompt_edit_form {
    margin-bottom: 80px;
}

/* Insights generation run — clearance for fixed footer actions. */
#admin_insights_generation_run_page form.insights_generation_run_form {
    margin-bottom: 80px;
}

#admin_insights_generation_run_page #insights_generation_run_sheet_errors {
    margin-top: 12px;
    padding: 15px;
    border-radius: 6px;
    font-size: 14px;
    line-height: 1.6;
}

#admin_insights_generation_run_page #insights_generation_run_sheet_errors.insights_generation_run_sheet_errors_error {
    background-color: #ffebee;
    border: 1px solid #ef5350;
    color: #c62828;
}

#admin_insights_generation_run_page .insights_generation_run_sheet_errors_message {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#admin_insights_generation_run_page .insights_generation_run_sheet_errors_main {
    font-weight: 600;
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

#admin_insights_generation_run_page .insights_generation_run_sheet_errors_main i {
    margin-top: 2px;
}

#admin_insights_generation_run_page .insights_generation_run_sheet_errors_list {
    margin: 0;
    padding-left: 22px;
}

#admin_insights_generation_run_page .insights_generation_run_sheet_errors_list li {
    margin-bottom: 4px;
}

#admin_insights_generation_run_page #insights_generation_run_sheet_status {
    margin-top: 8px;
    font-size: 14px;
}

#admin_insights_generation_run_page #insights_generation_run_sheet_status.insights_generation_run_sheet_status_success {
    background-color: #e8f5e9;
    border: 1px solid #81c784;
    color: #2e7d32;
    padding: 10px 12px;
    border-radius: 6px;
    font-weight: 600;
}

#admin_insights_generation_run_page .insights_generation_run_status {
    font-size: 14px;
}

#admin_insights_generation_run_page .insights_generation_run_status_steps {
    margin: 0;
    padding-left: 18px;
}

#admin_insights_generation_run_page .insights_generation_run_status_steps li {
    margin-bottom: 4px;
}

.insights_generation_run_overlay_panel {
    position: relative;
}

.insights_generation_run_overlay_close {
    position: absolute;
    top: 10px;
    right: 12px;
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
    font-size: 16px;
    line-height: 1;
    color: #666;
    cursor: pointer;
}

.insights_generation_run_overlay_close:hover,
.insights_generation_run_overlay_close:focus {
    color: #222;
    background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
}

.seo_content_generation_overlay:not(.seo_content_generation_overlay_failed) .insights_generation_run_overlay_close {
    display: none;
}

/* References edit — clearance for fixed footer above Add Reference / last section. */
#admin_prompt_references_edit_page form.prompt_references_edit_form {
    margin-bottom: 43px;
}

#admin_prompt_references_edit_page .prompt_references_edit_reference_id {
    color: #8a8f98;
    font-weight: 600;
}

/* Solutions edit — clearance for fixed footer above action buttons. */
#admin_solutions_edit_page form.solutions_edit_form {
    margin-bottom: 43px;
}

/* Solutions primary + secondary categories side by side. */
#admin_solutions_edit_page .solutions_edit_categories_row {
    display: flex;
    flex-direction: row;
    gap: 16px;
    width: 100%;
    box-sizing: border-box;
}

#admin_solutions_edit_page .solutions_edit_categories_row > .edit_section_content_item {
    flex: 1;
    min-width: 0;
}

@media (max-width: 768px) {
    #admin_solutions_edit_page .solutions_edit_categories_row {
        flex-direction: column;
        gap: 12px;
    }
}

#admin_solutions_edit_page .solutions_edit_primary_category_row .edit_section_content_item_select_wrapper select.edit_section_content_item_value_select,
#admin_solutions_edit_page .solutions_edit_secondary_category_row .edit_section_content_item_select_wrapper select.edit_section_content_item_value_select {
    padding-right: 44px;
    box-sizing: border-box;
}

#admin_solutions_edit_page .solutions_edit_insights_selected {
    margin-top: 8px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
}

#admin_solutions_edit_page .solutions_edit_insight_row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    background: #fff;
    width: 100%;
    box-sizing: border-box;
}

#admin_solutions_edit_page .solutions_edit_insight_row_ghost {
    opacity: 0.5;
    background: #f0f0f0;
}

#admin_solutions_edit_page .solutions_edit_insight_handle {
    flex-shrink: 0;
    cursor: grab;
    color: #888;
    padding: 2px 4px;
    touch-action: none;
}

#admin_solutions_edit_page .solutions_edit_insight_handle:active {
    cursor: grabbing;
}

#admin_solutions_edit_page .solutions_edit_insight_number {
    flex-shrink: 0;
    font-weight: 600;
    min-width: 1.5em;
    font-size: 14px;
    color: #364153;
}

#admin_solutions_edit_page .solutions_edit_insight_label {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    color: #364153;
}

#admin_solutions_edit_page .solutions_edit_insight_remove_btn {
    flex-shrink: 0;
    border: none;
    background: transparent;
    color: #666;
    cursor: pointer;
    padding: 2px 6px;
    font-size: 14px;
}

#admin_solutions_edit_page .solutions_edit_insight_remove_btn:hover {
    color: #333;
}

#admin_solutions_edit_page #solutions_add_insight_btn {
    margin-top: 4px;
}

#admin_solutions_edit_page #solutions_add_insight_btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.solutions_insights_modal_search_row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px 8px;
    flex-shrink: 0;
    box-sizing: border-box;
}

.solutions_insights_modal_search_input {
    flex: 1;
    min-width: 0;
    height: 36px;
    padding: 6px 10px;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    font-size: 14px;
    font-family: Helvetica, Arial, sans-serif;
    box-sizing: border-box;
}

#solutions_insights_modal_search_btn {
    flex-shrink: 0;
    min-height: 36px;
}

#admin_insight_edit_page .insight_edit_source_configurable_row .edit_section_content_item_select_wrapper select.edit_section_content_item_value_select,
#admin_insight_edit_page .insight_edit_inference_type_row .edit_section_content_item_select_wrapper select.edit_section_content_item_value_select {
    padding-right: 44px;
    box-sizing: border-box;
}

#admin_insight_edit_page .insight_edit_source_insights_selected {
    margin-top: 8px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
}

#admin_insight_edit_page .insight_edit_source_insight_row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    background: #fff;
    width: 100%;
    box-sizing: border-box;
}

#admin_insight_edit_page .insight_edit_source_insight_row_ghost {
    opacity: 0.5;
    background: #f0f0f0;
}

#admin_insight_edit_page .insight_edit_source_insight_handle {
    flex-shrink: 0;
    cursor: grab;
    color: #888;
    padding: 2px 4px;
    touch-action: none;
}

#admin_insight_edit_page .insight_edit_source_insight_handle:active {
    cursor: grabbing;
}

#admin_insight_edit_page .insight_edit_source_insight_number {
    flex-shrink: 0;
    font-weight: 600;
    min-width: 1.5em;
    font-size: 14px;
    color: #364153;
}

#admin_insight_edit_page .insight_edit_source_insight_label {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    color: #364153;
}

#admin_insight_edit_page .insight_edit_source_insight_remove_btn {
    flex-shrink: 0;
    border: none;
    background: transparent;
    color: #666;
    cursor: pointer;
    padding: 2px 6px;
    font-size: 14px;
}

#admin_insight_edit_page .insight_edit_source_insight_remove_btn:hover {
    color: #333;
}

#admin_insight_edit_page #insight_edit_add_source_insight_btn {
    margin-top: 4px;
}

#admin_insight_edit_page #insight_edit_add_source_insight_btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

.insight_edit_source_insights_modal_search_row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px 8px;
    flex-shrink: 0;
    box-sizing: border-box;
}

.insight_edit_source_insights_modal_search_input {
    flex: 1;
    min-width: 0;
    height: 36px;
    padding: 6px 10px;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    font-size: 14px;
    font-family: Helvetica, Arial, sans-serif;
    box-sizing: border-box;
}

#insight_edit_source_insights_modal_search_btn,
#insight_edit_test_labels_modal_search_btn {
    flex-shrink: 0;
    min-height: 36px;
}

#admin_insight_edit_page .insight_edit_test_labels_row {
    margin-top: 8px;
}

#admin_insight_edit_page .insight_edit_test_labels_selected {
    margin-top: 8px;
    margin-bottom: 10px;
}

/* Matches the metrics the read-only inputs get from admin.css input[type=text]. */
#admin_insight_edit_page .insight_edit_origin_value {
    height: 34px;
    padding: 0 16px !important;
    border: 1px solid #BFBFBF;
    border-radius: 2px;
    box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.1);
}

#admin_insight_edit_page .insight_edit_origin_text {
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#admin_insight_edit_page .insight_edit_origin_run_link {
    color: inherit;
    text-decoration: underline;
}

#admin_insight_edit_page .insight_edit_supported_app_row {
    margin-top: 8px;
}

#admin_insight_edit_page .insight_edit_supported_object_types_row {
    margin-top: 8px;
}

#admin_insight_edit_page .insight_edit_supported_object_types_list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 8px;
}

#admin_insight_edit_page .insight_edit_supported_object_type_option {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    line-height: 1.4;
    cursor: pointer;
}

#admin_insight_edit_page .insight_edit_supported_object_type_option input[type="checkbox"] {
    margin: 0;
    width: 16px;
    height: 16px;
}

.insight_edit_test_labels_modal_create_wrap {
    flex-shrink: 0;
    padding: 0 20px 8px;
    box-sizing: border-box;
}

.insight_edit_test_labels_modal_create {
    display: block;
    width: 100%;
    margin: 0;
    padding: 8px 10px;
    border: none;
    background: none;
    text-align: left;
    font-size: 14px;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 1.4;
    cursor: pointer;
    border-radius: 4px;
    color: #1976D2;
    font-weight: 600;
    box-sizing: border-box;
}

.insight_edit_test_labels_modal_create:hover {
    background: #f0f4f8;
}

#admin_insight_edit_page .insight_remove_btn {
    display: none;
}

#admin_insight_edit_page #insights_container.insight_edit_payload_error {
    outline: 2px solid #c62828;
    outline-offset: 2px;
    border-radius: 4px;
}

.insight_edit_page_core_locked #insights_container input:not([type="hidden"]),
.insight_edit_page_core_locked #insights_container textarea,
.insight_edit_page_core_locked #insights_container select {
    background-color: #f5f5f5;
}

/* Insight category select: room for RHS chevron (matches other select fields). */
#admin_insight_edit_page .insight_edit_category_row .edit_section_content_item_select_wrapper select.edit_section_content_item_value_select,
#admin_insight_edit_page .insight_edit_secondary_category_row .edit_section_content_item_select_wrapper select.edit_section_content_item_value_select,
#admin_insight_edit_page .insight_edit_inference_type_row .edit_section_content_item_select_wrapper select.edit_section_content_item_value_select {
    padding-right: 44px;
    box-sizing: border-box;
}

/* Primary + Secondary categories side by side on insight edit. */
#admin_insight_edit_page .insight_edit_categories_row {
    display: flex;
    flex-direction: row;
    gap: 16px;
    width: 100%;
    box-sizing: border-box;
}

#admin_insight_edit_page .insight_edit_categories_row > .edit_section_content_item {
    flex: 1;
    min-width: 0;
}

@media (max-width: 768px) {
    #admin_insight_edit_page .insight_edit_categories_row {
        flex-direction: column;
        gap: 12px;
    }
}

#admin_insight_edit_page .insight_edit_references_row {
    width: 100%;
    align-self: stretch;
}

/* Audience-style Add Reference dropdown (options), then full-width selected rows. */
#admin_insight_edit_page .insight_edit_reference_dropdown_wrapper {
    width: 100%;
    margin-top: 12px;
}

#admin_insight_edit_page .insight_edit_reference_dropdown {
    left: 0;
    right: auto;
    min-width: 280px;
    max-width: 100%;
    z-index: 20;
}

#admin_insight_edit_page .insight_edit_reference_dropdown[hidden] {
    display: none !important;
}

#admin_insight_edit_page #insight_add_reference_btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Selected catalog refs: full-width rows (same chrome as transformation Reference Content). */
#admin_insight_edit_page #insight_references_container {
    width: 100%;
    align-self: stretch;
    margin-top: 0;
    box-sizing: border-box;
}

#admin_insight_edit_page #insight_references_container:empty {
    display: none;
}

#admin_insight_edit_page #insight_references_container .edit_reference_item {
    width: 100%;
    align-self: stretch;
    box-sizing: border-box;
}

#admin_insight_edit_page #insight_references_container .edit_reference_input[readonly] {
    background: #FFF !important;
    color: #0A0A0A;
    cursor: default;
}

#admin_insight_edit_page .insight_edit_references_empty_hint:empty {
    display: none;
}

/**
 * Test Page Version Dropdown Styles
 * Custom dropdown for selecting transformation versions on the test page
 */

.test_version_dropdown {
    position: relative;
    display: inline-block;
    width: 100%;
}

.test_version_dropdown_trigger {
    width: 100%;
    padding: 12px 40px 12px 15px;
    font-size: 14px;
    border: 2px solid #ddd;
    border-radius: 6px;
    background: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.3s ease;
    font-family: inherit;
    min-height: 44px;
}

.test_version_dropdown_trigger:hover {
    border-color: #2196F3;
}

.test_version_dropdown.test_version_dropdown_open .test_version_dropdown_trigger {
    border-color: #2196F3;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.test_version_dropdown_arrow {
    color: #666;
    font-size: 12px;
    transition: transform 0.3s ease;
    flex-shrink: 0;
    margin-left: 10px;
}

.test_version_dropdown.test_version_dropdown_open .test_version_dropdown_arrow {
    transform: rotate(180deg);
}

.test_version_dropdown_options {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 2px solid #2196F3;
    border-top: none;
    border-radius: 0 0 6px 6px;
    max-height: 300px;
    overflow-y: auto;
    display: none;
    z-index: 1000;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.test_version_dropdown.test_version_dropdown_open .test_version_dropdown_options {
    display: block;
}

.test_version_dropdown_option {
    padding: 12px 15px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.2s ease;
    border-bottom: 1px solid #f0f0f0;
}

.test_version_dropdown_option:last-child {
    border-bottom: none;
}

.test_version_dropdown_option:hover {
    background: #f5f5f5;
}

.test_version_dropdown_option.test_version_dropdown_option_selected {
    background: #e3f2fd !important;
    font-weight: 500;
    color: #1976d2;
}

.test_version_dropdown_selected_text {
    flex: 1;
    text-align: left;
}

/* Custom scrollbar for options */
.test_version_dropdown_options::-webkit-scrollbar {
    width: 8px;
}

.test_version_dropdown_options::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.test_version_dropdown_options::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.test_version_dropdown_options::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Disabled state */
.test_version_dropdown.test_version_dropdown_disabled .test_version_dropdown_trigger {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .test_version_dropdown {
        width: 100%;
    }
    
    .test_version_dropdown_options {
        max-height: 250px;
    }
}


/**
 * File Search Styles
 * Search input for filtering files from connected apps
 */

 .file-search-container {
    position: relative;
    width: 100%;
}

.file-search-input {
    width: 100%;
    padding: 8px 12px 8px 35px;
    font-size: 14px;
    border: 2px solid #ddd;
    border-radius: 6px;
    background: white;
    transition: all 0.3s ease;
    font-family: inherit;
    box-sizing: border-box;
}

.file-search-input:focus {
    outline: none;
    border-color: #2196F3;
    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);
}

.file-search-input::placeholder {
    color: #999;
}



/**
 * Edit Page - Reference Content Management Styles
 * Styles for adding/removing reference labels in edit.html
 * Naming convention: edit_classname_functionality
 */

/* Make stakeholder insight container full width */
.stakeholder_insight_container {
    width: 100%;
    box-sizing: border-box;
}

/* Make reference container full width with gap */
.edit_references_container_wrapper {
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.edit_reference_item {
    width: 100%;
    box-sizing: border-box;
    background: #FFF;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    padding: 18px;
    margin-bottom: 0;
    display: flex !important;
    align-items: stretch;
    gap: 12px;
    transition: all 0.3s ease;
}

.prompt_references_edit_reference_main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.prompt_references_edit_reference_fields {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
}

.prompt_references_edit_reference_fields .edit_reference_input_wrapper {
    flex: 1 1 auto;
    min-width: 0;
}

#admin_prompt_references_edit_page .prompt_references_edit_reference_fields .edit_reference_input {
    height: 44px;
    min-height: 44px;
}

.prompt_references_edit_field_label {
    color: #364153;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 21px;
    min-height: 21px;
    margin-bottom: 4px;
}

.prompt_references_edit_sources_wrapper {
    flex: 0 0 260px;
    width: 260px;
    min-width: 220px;
    display: flex;
    flex-direction: column;
}

.prompt_references_edit_sources_control {
    position: relative;
    width: 100%;
}

.prompt_references_edit_sources_toggle {
    width: 100%;
    min-height: 44px;
    height: 44px;
    padding: 12px 16px;
    border: 1px solid #D1D5DC;
    border-radius: 5px;
    background: #FFF;
    color: #0A0A0A;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 21px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    cursor: pointer;
    box-sizing: border-box;
    text-align: left;
}

.prompt_references_edit_sources_toggle:disabled,
.prompt_references_edit_sources_toggle_locked {
    cursor: default;
    background: #F5F5F5;
    color: #555;
}

.prompt_references_edit_sources_summary {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 6px;
}

.prompt_references_edit_sources_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    overflow: visible;
}

.prompt_references_edit_sources_icon img {
    width: 18px;
    height: 18px;
    display: block;
    object-fit: contain;
}

.prompt_references_edit_sources_icon i {
    font-size: 16px;
    line-height: 18px;
    color: #364153;
    width: 18px;
    text-align: center;
}

.prompt_references_edit_sources_chevron {
    flex: 0 0 auto;
    color: #364153;
}

.prompt_references_edit_sources_dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 20;
    background: #FFF;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box;
    max-height: 240px;
    overflow-y: auto;
}

.prompt_references_edit_sources_option {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 21px;
    color: #0A0A0A;
    cursor: pointer;
    padding: 4px 2px;
}

.prompt_references_edit_sources_select_all {
    font-weight: 700;
    border-bottom: 1px solid #E5E7EB;
    padding-bottom: 8px;
    margin-bottom: 2px;
}

.prompt_references_edit_sources_option_input {
    width: 16px;
    height: 16px;
    margin: 0;
    flex: 0 0 auto;
    cursor: pointer;
}

.prompt_references_edit_sources_wrapper ._error {
    padding: 6px 10px;
    color: #d32f2f;
    word-break: break-word;
    font-size: 14px;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 21px;
    min-height: 21px;
    border: 1px solid #d32f2f;
    border-radius: 4px;
    margin-top: 4px;
}

.prompt_references_edit_sources_wrapper ._error:empty {
    display: none;
}

.prompt_references_edit_reference_fields .edit_reference_remove_btn_wrapper {
    flex: 0 0 auto;
    align-self: flex-end;
    margin-bottom: 0;
    height: 44px;
}

@media (max-width: 768px) {
    .prompt_references_edit_reference_fields {
        flex-direction: column;
        flex-wrap: wrap;
    }

    .prompt_references_edit_sources_wrapper {
        width: 100%;
        flex: 1 1 auto;
    }

    .prompt_references_edit_reference_fields .edit_reference_remove_btn_wrapper {
        align-self: flex-start;
    }
}


.edit_reference_item:hover {
    border-color: #BFBFBF;
    box-shadow: none;
}

/* Show and style the label div */
.edit_reference_label {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    min-width: 100px;
}

.edit_reference_label strong {
    color: #364153;
    font-family: Helvetica;
    font-size: 14px;
    font-weight: 700;
    line-height: 21px;
}

.edit_reference_input_wrapper {
    flex: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.edit_reference_input_wrapper ._error {
    padding: 6px 10px;
    color: #d32f2f;
    word-break: break-word;
    font-size: 14px;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 21px;
    min-height: 21px;
    border: 1px solid #d32f2f;
    border-radius: 4px;
    margin-top: 4px;
}

.edit_reference_input_wrapper ._error:empty {
    display: none;
}

.edit_reference_input {
    width: 100%;
    padding: 12px 16px !important;
    border: 1px solid #D1D5DC !important;
    border-radius: 5px;
    background: #FFF !important;
    color: #0A0A0A;
    font-family: Helvetica;
    font-size: 14px !important;
    font-style: normal;
    line-height: 21px;
    box-sizing: border-box;
    height: auto;
    min-height: 44px;
    box-shadow: none !important;
    transition: all 0.3s ease;
}

.edit_reference_input:focus {
    outline: none;
    border-color: #D1D5DC !important;
    box-shadow: none !important;
}

.edit_reference_input::placeholder {
    color: #999;
}

.edit_reference_input_error {
    border-color: #d32f2f !important;
    background-color: #ffebee !important;
}

/* Error styling for all input fields (reusing reference error colors) */
/* Target all form elements with error class - the !important ensures it overrides any specific background rules */
input.edit_input_error,
textarea.edit_input_error,
select.edit_input_error {
    border-color: #d32f2f !important;
    background-color: #ffebee !important;
}

.edit_reference_remove_btn_wrapper {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
}

.edit_reference_remove_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    border: 1px solid #FB2C36;
    background: #FFF;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
    color: #FB2C36;
    width: 32px;
    height: 32px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.edit_reference_remove_btn:hover {
    background: #FB2C36;
    color: #FFF;
    transform: none;
}

.edit_reference_remove_btn:active {
    transform: none;
}

.edit_reference_remove_btn i {
    width: 13px;
    height: 15px;
    flex-shrink: 0;
    aspect-ratio: 13/15;
    color: #FB2C36;
}

.edit_reference_remove_btn:hover i {
    color: #FFF;
}

/* #add_insight_btn {
    margin-bottom: 30px;
} */

#stakeholder_insight_container {
    margin-bottom: 30px;
}

#stakeholder_insight_container.edit_stakeholder_insight_block_error {
    outline: 2px solid #c62828;
    outline-offset: 2px;
    border-radius: 4px;
}

#stakeholder_insight_container_error:empty {
    display: none;
    border: none;
    min-height: 0;
    padding: 0;
    margin: 0;
}

/* SEO Details Styles */
.edit_seo_textarea {
    height: 50px !important;
    min-height: 50px !important;
    resize: none;
    overflow-y: auto;
}

.edit_seo_container {
    /* margin-bottom: 15px; */
    width: 100%;
    gap: 12px;
    display: flex;        /* Add this - makes gap work */
    flex-direction: column;
}

.edit_seo_item {
    /* margin-bottom: 20px; */
    padding: 18px;
    border: 1px solid #BFBFBF;
    background: #F9FAFB;
    border-radius: 5px;
    display: flex;
    /* width: 100%; */
    /* height: 206px; */
    /* padding: 18px 0 18px 18px; */
    flex-direction: column;
    /* align-items: flex-start; */
    gap: 16px;
    /* flex-shrink: 0; */
    position: relative;
}

.edit_seo_field {
    margin-bottom: 15px;
}

.edit_seo_field:last-child {
    margin-bottom: 0;
}

.edit_seo_input {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    font-family: inherit;
    box-sizing: border-box;
    height: 40px;
}

.edit_seo_input:focus {
    outline: none;
    border-color: #2196F3;
    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);
}

.edit_seo_solution_item,
.edit_seo_stakeholder_item {
    background: #f9f9f9;
    border: 2px solid #e0e0e0;
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 10px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    position: relative;
    transition: all 0.3s ease;
}

.edit_seo_solution_item:hover,
.edit_seo_stakeholder_item:hover {
    border-color: #bbb;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.edit_seo_remove_btn_wrapper {
    display: flex;
    /* padding: 6px 10px; */
    align-items: center;
    /* gap: 4px; */
}

.edit_seo_remove_btn {
    border-radius: 5px;
    border: 1px solid #FB2C36;
    background: #FFF;
    color: #FB2C36;
    padding: 6px 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 14px;
    font-family: inherit;
}

.edit_seo_remove_btn:hover {
    background: #FB2C36;
    color: #FFF;
}

.edit_seo_remove_btn:active {
    transform: scale(0.95);
}

.edit_seo_remove_btn i {
    font-size: 14px;
    line-height: 1;
}

/**
 * Edit Page - Insights Builder
 */

.insights_container {
    display: flex;
    flex-direction: column;
    gap: 15px;
    width: 100%;
    box-sizing: border-box;
}

.insight_item {
    width: 100%;
    box-sizing: border-box;
    border-radius: 5px;
    border: 1px solid #BFBFBF;
    background: #FFF;
    padding: 0;
}

.insight_item_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 63px;
    padding: 0 16px;
    gap: 12px;
    margin-bottom: 0;
    cursor: pointer;
}

.insight_item_header_left {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 12px;
}

.insight_item_header_right {
    display: flex;
    align-items: center;
    gap: 12px;
}

.insight_title {
    color: #333;
    font-size: 16px;
}

.insight_remove_btn {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    border: 1px solid #FB2C36;
    background: #FFF;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10), 0 1px 2px -1px rgba(0, 0, 0, 0.10);
    color: #FB2C36;
    width: 32px;
    height: 32px;
}

.insight_remove_btn i {
    width: 13px;
    height: 15px;
    flex-shrink: 0;
    aspect-ratio: 13/15;/* Red icon color to match border */
}

.insight_remove_btn:hover {
    background: #FB2C36;
    color: #FFF;
}

.insight_fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 16px 16px;
    border-radius: 5px;
    background: #FFF;
}

/* Collapsible insight styles */
.insight_item.collapsed .insight_fields {
    display: none;
}


/* Collapse button uses dropdown icon container style - rotation for collapsed state */
.insight_item.collapsed .edit_section_content_item_select_icon_container .edit_section_content_item_select_icon {
    transform: rotate(-90deg);
}



.edit_system_prompt_textarea {
    height: 48px !important;
    min-height: 48px !important;
    resize: none;
    overflow-y: auto;
}

.insight_data_type_config {
    padding: 14px;
    background: #f9f9f9;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    display: flex;
    flex-direction: column;
    width: 100%;
    box-sizing: border-box;
}

.insight_data_type_config > .edit_section_content_item:not(:last-child),
.insight_data_type_config > .insight_paired_field_group:not(:last-child),
.insight_data_type_config > .insight_dynamic_column_group:not(:last-child) {
    margin-bottom: 14px;
}

.insight_data_type_config .edit_section_content_item_label {
    color: #364153 !important;
    font-family: "Helvetica Neue" !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 450 !important;
    line-height: 21px !important;
}

.insight_data_type_description {
    margin-top: 8px;
    padding: 12px;
    border-radius: 5px;
    border: 1px solid #BFBFBF;
    background: #F4F4F4;
    font-size: 14px;
    color: #364153;
    font-style: normal;
    white-space: pre-wrap;
    font-family: Helvetica, Arial, 'lucida grande', tahoma, verdana, arial, sans-serif;
    line-height: 21px;
    width: 100%;
    box-sizing: border-box;
}


.insight_dynamic_column_group {
    display: grid !important;
    grid-template-columns: 2fr 1.5fr 6.5fr !important;
    column-gap: 16px;
    row-gap: 0;
    padding: 12px;
    background: white;
    border: 1px solid #ccc;
    border-radius: 4px;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

.insight_dynamic_column_group .edit_section_content_item {
    margin-bottom: 0 !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

.insight_dynamic_column_group .edit_section_content_item_label {
    width: 100%;
    flex-shrink: 0;
    box-sizing: border-box;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 5px;
}

.insight_dynamic_column_group .edit_section_content_item input,
.insight_dynamic_column_group .edit_section_content_item textarea,
.insight_dynamic_column_group .edit_section_content_item select {
    width: 100% !important;
    min-width: 0;
    box-sizing: border-box !important;
    max-width: 100%;
    margin: 0;
}

.insight_dynamic_column_group .edit_section_content_item:not(:last-child) {
    margin-right: 0;
}

.insight_paired_field_group {
    display: grid;
    grid-template-columns: 3fr 7fr;
    column-gap: 16px;
    padding: 12px;
    background: white;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.insight_paired_field_group .edit_section_content_item {
    margin-bottom: 0;
}

/**
 * View Page Styles
 */

.view_actions_buttons {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* UA styles often add vertical margins on forms; misaligns sibling flex items vs one inner flex row */
.view_actions_buttons form {
    margin: 0;
}

/**
 * Test Page - Reference Content Section Styles
 * Styles for the reference content section in test.html
 */

.test_description_reference_content {
    margin: 5px 0 10px 0;
    font-size: 14px;
}

/**
 * Test Page - Insights select all
 * Row above insight cards for "Select all" checkbox (test.html)
 */

.test_insights_select_all_row {
    margin-bottom: 8px;
    font-size: 14px;
}

.test_insights_select_all_label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    color: #333;
}

.test_insights_select_all_checkbox {
    cursor: pointer;
    flex-shrink: 0;
}

/**
 * Test Page Styles
 * Styles for transformation testing page (test.html)
 */

/* Prevent horizontal scroll */
body {
    overflow-x: hidden;
}

/* Page reload overlay animation */
#page_reload_overlay {
    animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Split Pane Styles */
#split_container {
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    width: 100%;
    overflow-x: hidden;
}

/* Ensure content wraps and doesn't overflow */
#left_panel *,
#right_panel * {
    max-width: 100%;
    word-wrap: break-word;
    overflow-wrap: break-word;
    box-sizing: border-box;
}

#left_panel pre,
#right_panel pre {
    overflow-x: auto;
    max-width: 100%;
}

/* Ensure form elements don't overflow */
#left_panel textarea,
#left_panel input[type="text"],
#left_panel select {
    max-width: 100%;
    box-sizing: border-box;
}

/* Fix textarea height and resize */
#left_panel textarea {
    min-height: 200px !important;
    resize: vertical !important;
    display: block !important;
}

#reference_text {
    min-height: 200px !important;
    resize: vertical !important;
    display: block !important;
}

/* Ensure textarea resize handle is visible */
textarea {
    overflow: auto !important;
}

/* Fix for all textareas in form fields */
form.edit_form ._field textarea {
    display: block !important;
}

/* Specific fix for resizable textareas - highest specificity */
form.edit_form ._field ._value textarea.resizable-textarea,
textarea.resizable-textarea,
#reference_text {
    display: block !important;
    resize: vertical !important;
    overflow: auto !important;
    -webkit-appearance: textfield !important;
    appearance: textfield !important;
}

/* Override global flex display on all textareas */
div._value textarea {
    display: block !important;
}

/* Scrollbar styles for panels */
#left_panel::-webkit-scrollbar,
#right_panel::-webkit-scrollbar {
    width: 8px;
}

#left_panel::-webkit-scrollbar-track,
#right_panel::-webkit-scrollbar-track {
    background: #f1f1f1;
}

#left_panel::-webkit-scrollbar-thumb,
#right_panel::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

#left_panel::-webkit-scrollbar-thumb:hover,
#right_panel::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Version selector */
#version_selector:hover {
    border-color: #999 !important;
}

#version_selector:focus {
    outline: none;
    border-color: #2196F3 !important;
    box-shadow: 0 0 0 3px rgba(33, 150, 243, 0.1);
}

/* Input mode cards */
.input-mode-card {
    transition: all 0.3s ease;
}

.input-mode-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.input-mode-card.active {
    border-width: 2px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Parameter mode cards */
.param-mode-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0,0,0,0.12);
}

/* Parameter items */
.parameter_item {
    border: 1px solid #ddd;
    padding: 15px;
    border-radius: 4px;
    margin-bottom: 10px;
    background: #f9f9f9;
}

.parameter_item:hover {
    border-color: #bbb !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* App items */
.app_item:hover {
    background: #f5f5f5;
}

.app_item.active {
    background: #e3f2fd;
}

.app_item img {
    width: 24px !important;
    height: 24px !important;
}

.app_item i.fa-fw {
    font-size: 24px;
}

/* File items */
.file_item {
    padding: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    margin-bottom: 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
}

.file_item:hover {
    background: #f9f9f9;
}

.file_item.selected {
    background: #e8f5e9;
    border-color: #4CAF50;
}

.file_item input[type="radio"] {
    width: 18px;
    height: 18px;
}

/* Selected file chips */
.selected_file_chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #e3f2fd;
    padding: 8px 12px;
    border-radius: 16px;
    margin: 4px;
    font-size: 13px;
}

.selected_file_chip .remove_btn {
    background: none;
    border: none;
    color: #666;
    cursor: pointer;
    font-size: 16px;
    padding: 0;
    margin: 0;
}

/* Mobile Responsive Styles */
@media (max-width: 768px) {
    #split_container {
        flex-direction: column !important;
        min-height: calc(100vh - 150px);
        max-width: 100vw !important;
    }
    
    #left_panel {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        border-right: none !important;
        border-bottom: 1px solid #ddd;
        max-height: none;
    }
    
    #divider {
        display: none !important;
    }
    
    #right_panel {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 400px;
    }
    
    .input-mode-card {
        padding: 15px !important;
    }
    
    .input-mode-card h4 {
        font-size: 14px !important;
    }
    
    .input-mode-card p {
        font-size: 12px !important;
    }
    
    #version_selector {
        max-width: 100% !important;
    }
}

@media (max-width: 480px) {
    .input-mode-container {
        flex-direction: column !important;
        gap: 10px !important;
    }
    
    #mode_card_text,
    #mode_card_files {
        margin-bottom: 0 !important;
    }
}

/**
 * Edit Page - Section Organization Styles
 * Highly visible section headings that act as navigation landmarks
 * Naming convention: edit_section_component
 */

/* Section Container - outer wrapper with border matching Figma design */
.edit_section_container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    padding: 1px;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    background: #FFF;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.10);
    margin-bottom: 12px;
}

/* Section Header Container */
.edit_section_header {
    display: flex;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    padding: 15px;
    background: #E3F2FD;
    border-bottom: var(--borderd);
}

/* Inner frame inside header - matching Figma design */
.edit_section_header_frame {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.edit_insights_header_actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

/* Section Heading Text */
.edit_section_heading {
    color: #364153;
    font-style: normal;
    font-family: Helvetica;
    font-size: 18px;
    font-weight: 700;
    line-height: 27px;
}

/* Question mark icon container - matching Figma design */
.edit_section_header_icon {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 6px;
    border-radius: 25px;
    border: 1px solid #364153;
    background: #FFF;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
    align-self: center;
    box-sizing: border-box;
    line-height: normal;
    font-size: 14px;
    margin: 0;
    vertical-align: baseline;
    color: inherit;
}

.edit_section_header_icon:hover .edit_section_header_icon_frame i {
    color: #1976D2;
    font-size: 17px;
    font-weight: 1500;
}

.edit_section_header_icon_frame {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
}

.edit_section_header_icon_frame i {
    color: #364153;
}

/* Section Content Container - matching Figma design */
.edit_section_content {
    display: flex;
    /* height: 388px; */
    padding: 18px;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    flex-shrink: 0;
    align-self: stretch;
}

.edit_section_content_item {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    /* height: 76px; */
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    flex-shrink: 0;
}

.edit_section_content_item_label {
    display: flex;
    /* width: 575px; */
    /* padding-right: 558px; */
    align-items: center;
    color: #364153;
    font-family: Helvetica;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px;
}

.edit_section_content_item_value_non_editable {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 16px !important;
    align-items: center;
    bottom: 0;
    border-radius: 5px;
    border: 1px solid #D1D5DC;
    background: #F4F4F4;
    color: #4A5565;
    font-family: Helvetica;
    font-size: 14px !important;
    font-style: normal;
    line-height: 21px; /* 150% */
}

.edit_section_content_item_value_editable {
    display: flex;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 16px !important;
    align-items: center;
    bottom: 6px;
    border-radius: 5px;
    border: 1px solid #D1D5DC !important;
    background: #FFF !important;
    color: #0A0A0A;
    font-family: Helvetica;
    font-size: 14px !important;
    font-style: normal;
    line-height: 21px;
    box-shadow: none !important;
}

.edit_section_content_item_select_wrapper {
    position: relative;
    width: 100%;
}

.edit_section_content_item_select_icon_container {
    position: absolute;
    right: 8.5px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    width: 27px;
    height: 27px;
    justify-content: center;
    align-items: center;
    border-radius: 3.375px;
    background: #D1D5DC;
}

.marketing_nav_icon_picker .edit_section_content_item_select_icon_container {
    pointer-events: none;
}

.edit_section_content_item_select_icon {
    height: 18px;
    flex-shrink: 0;
}

.edit_section_content_item_value_select {
    width: 100%;
    display: flex;
    height: 44px;
    flex-direction: column;
    align-items: flex-start;
    padding: 12px;
    border-radius: 5px;
    border: 1px solid #D1D5DC;
    background: #FFF;
    -webkit-appearance: none;
}

/* Marketing nav icon picker — same closed look as native select, FA icons in options */
.marketing_nav_icon_picker {
    position: relative;
    width: 100%;
}

button.marketing_nav_icon_picker_trigger {
    box-sizing: border-box;
    width: 100%;
    display: flex;
    align-items: center;
    min-height: 44px;
    height: 44px;
    margin: 0;
    padding: 12px 48px 12px 12px;
    border-radius: 5px;
    border: 1px solid #D1D5DC;
    background: #FFF;
    background-image: none;
    color: #0A0A0A;
    cursor: pointer;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    text-align: left;
    white-space: nowrap;
    filter: none;
}

.marketing_nav_icon_picker_trigger:hover,
.marketing_nav_icon_picker_trigger:focus-visible {
    outline: none;
    border-color: #D1D5DC;
    background: #FFF;
    background-image: none;
}

.marketing_nav_icon_picker_trigger_content {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.marketing_nav_icon_picker_trigger_icon {
    flex-shrink: 0;
    width: 18px;
    text-align: center;
    color: #0A0A0A;
    font-size: 18px;
    line-height: 1;
}

.marketing_nav_icon_picker_trigger_label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.marketing_nav_icon_picker_open .marketing_nav_icon_picker_trigger {
    border-color: #9CA3AF;
}

.marketing_nav_icon_picker_panel {
    box-sizing: border-box;
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    z-index: 10000;
    max-height: 280px;
    overflow-x: hidden;
    overflow-y: auto;
    margin: 0;
    padding: 4px 0;
    border: 1px solid #D1D5DC;
    border-radius: 5px;
    background: #FFF;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.12);
}

.marketing_nav_icon_picker_panel[hidden] {
    display: none !important;
}

button.marketing_nav_icon_picker_option {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 40px;
    margin: 0;
    padding: 8px 12px;
    border: 0;
    border-radius: 0;
    background: transparent;
    background-image: none;
    color: #0A0A0A;
    cursor: pointer;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    text-align: left;
    white-space: nowrap;
    filter: none;
}

.marketing_nav_icon_picker_option:hover,
.marketing_nav_icon_picker_option:focus-visible {
    background: #F3F4F6;
    outline: none;
}

.marketing_nav_icon_picker_option_selected {
    background: #EEF2FF;
}

.marketing_nav_icon_picker_option_icon,
.marketing_nav_icon_picker_option_icon_spacer {
    flex-shrink: 0;
    width: 20px;
    text-align: center;
    font-size: 18px;
    line-height: 1;
    color: #0A0A0A;
}

.marketing_nav_icon_picker_option_label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.edit_section_content_item_value_textarea {
    display: flex;
    width: 100%;
    height: 110px;
    padding: 12px 16px !important;
    border-radius: 5px;
    border: 1px solid #D1D5DC;
    background: #FFF;
    /* position: absolute; */
    left: -1.5px;
    bottom: 0;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 14px !important;
    resize: vertical;
}

/* Error message styling for edit section content items */
.edit_section_content_item ._error {
    padding: 6px 10px;
    color: #d32f2f;
    word-break: break-word;
    font-size: 14px;
    font-family: Helvetica, Arial, sans-serif;
    line-height: 21px;
    min-height: 21px;
    border: 1px solid #d32f2f;
    border-radius: 4px;
    margin-top: 4px;
}

.edit_section_content_item_value_seo_overview {
    display: flex;
    width: 100%;
    height: 80px;
    padding: 12px 16px;
    border-radius: 5px;
    border: 1px solid #D1D5DC;
    background: #FFF;
    left: -1.5px;
    bottom: 0;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 14px;
    resize: vertical;
}

.edit_section_content_item_decision_outcomes_container {
    display: flex;
    /* width: 1320px;
    height: 206px; */
    padding: 18px;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    flex-shrink: 0;
    border-radius: 5px;
    border: 1px solid #BFBFBF;
    background: #F9FAFB;
}

.edit_section_content_item_decision_outcomes_heading_label {
    color: #364153;
    font-family: Helvetica;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
}

/* SEO Solutions label - blue color to distinguish as section header */
.seo_solutions_label {
    color: #1976D2;
    padding-top: 10px;
}

/* Solution Type wrapper - makes it look like a sub-part of SEO Solutions */
.solution_type_wrapper {
    padding-top: 10px;
    width: 100%;
    margin-bottom: 7px;
}

.solution_type_label {
    color: #364153;
    font-family: Helvetica;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px; /* 150% */
    padding-bottom: 4px;
}

.edit_section_content_item_decision_outcomes_heading_value {
    display: flex;
    margin-top: 2px !important;
    width: 100%;
    height: 47px !important;
    padding: 12px 16px !important;
    /* align-items: center; */
    /* position: absolute; */
    /* right: -308px; */
    /* bottom: 0; */
    border-radius: 5px;
    border: 1px solid #D1D5DC;
    background: #FFF;
    color: #0A0A0A;
    font-family: Helvetica;
    font-size: 14px !important;
    font-style: normal;
    /* font-weight: 400; */
    line-height: 21px;
}

.edit_section_content_item_decision_outcomes_body_value {
    display: flex;
    width: 100%;
    height: 80px;
    padding: 12px 16px;
    border-radius: 5px;
    border: 1px solid #D1D5DC;
    background: #FFF;
    left: -1.5px;
    bottom: 0;
    box-sizing: border-box;
    /* font-family: inherit; */
    /* font-size: 14px; */
    resize: vertical;
    
    color: #0A0A0A;
    font-family: Helvetica;
    font-size: 14px !important;
    font-style: normal;
    /* font-weight: 400; */
    line-height: 21px; /* 150% */
    
}

.edit_section_content_item_solutions_heading_label_row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.edit_section_add_button {
    display: flex;
    padding: 8px 10px;
    align-items: center;
    gap: 4px;
    border-radius: 5px;
    border: 1px solid #1976D2;
    color: #1976D2;
    text-align: center;
    font-family: Helvetica;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px; /* 150% */
    background: #FFF;
}

.edit_section_add_button_full {
    display: flex;
    padding: 8px 10px;
    align-items: center;
    gap: 4px;
    border-radius: 5px;
    border: 1px solid #1976D2;
    background: #1976D2;
    text-align: center;
    font-family: Helvetica;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px; /* 150% */
    color: #FFF;
}

/* Edit Page - Description Text Styles */
.edit_description_text {
    padding-top: 2px;
    padding-bottom: 10px;
    color: #4A5565;
    font-family: Helvetica;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 21px; /* 150% */
}

#insights_dropdown_container {
    padding-top: 20px;
}

/* Edit Page - References Container Wrapper */
.edit_references_container_wrapper {
    margin-bottom: 15px;
}

/* Utils Page Styles */
.transformations_utils_container {
    max-width: 800px;
    margin: 0;
}

.transformations_utils_section {
    margin-bottom: 30px;
    padding: 20px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}

.transformations_utils_section_heading {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 15px;
    color: #333;
    padding-bottom: 10px;
    border-bottom: 2px solid #e0e0e0;
}

.transformations_utils_section_content {
    padding: 10px 0;
}

.transformations_utils_description {
    font-size: 14px;
    color: #666;
    margin-bottom: 20px;
    line-height: 1.6;
}

/**
 * Edit Page - Action Buttons Container
 * Styles for Save, Publish, Unpublish, Test buttons matching Figma design
 */
.edit_actions_container {
    display: flex;
    align-items: center;
    gap: 15px;
    width: 100%;
    padding: 15px;
    margin: 0;
    background: #FFF;
    border-top: var(--borderd);
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background-color: var(--bgd);
}

.edit_action_button {
    display: flex;
    align-items: center;
    justify-content: center;
}

.edit_action_button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.insight_seo_draft_edit_group_title {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}

.insight_seo_draft_edit_textarea {
    min-height: 96px;
    width: 100%;
    box-sizing: border-box;
    resize: vertical;
}

.insight_seo_draft_edit_empty {
    margin: 0 0 16px;
    font-size: 14px;
    color: #4B5563;
}

.edit_action_button.transformations_edit_curation_active {
    background: #e8f5e9 !important;
    border: 1px solid #81c784 !important;
    color: #000000;
    filter: none;
    -ms-filter: none;
}

.edit_action_button.transformations_edit_curation_active:hover {
    background: #c8e6c9 !important;
    border-color: #66bb6a !important;
}

.edit_seo_prompt_modal_content {
    width: 92%;
    max-width: 480px;
    max-height: 85vh;
    display: flex;
    flex-direction: column;
}

.edit_seo_prompt_modal_body {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.edit_seo_prompt_modal_empty_message {
    margin: 0 0 8px;
    font-size: 14px;
    line-height: 1.5;
    color: #555;
}

.edit_seo_prompt_select_label {
    font-size: 12px;
    font-weight: 600;
    color: #555;
}

.edit_seo_prompt_select {
    width: 100%;
    min-width: 0;
    padding: 8px 10px;
    font-size: 14px;
}

.edit_seo_prompt_modal_footer {
    padding: 16px 20px;
    border-top: 1px solid #ddd;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.edit_seo_prompt_modal_footer_spacer {
    flex: 1;
    min-width: 8px;
}

.edit_seo_prompt_modal_generate_btn {
    font-weight: 600;
}

.seo_content_generation_overlay {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.seo_content_generation_overlay_backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}

.seo_content_generation_overlay_panel {
    position: relative;
    z-index: 1;
    min-width: 320px;
    max-width: 520px;
    padding: 24px 28px;
    border-radius: 8px;
    background: var(--bgd, #fff);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
    text-align: center;
}

.seo_content_generation_overlay_title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 12px;
}

.seo_content_generation_overlay_message {
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 16px;
    color: #444;
}

.seo_content_generation_overlay_spinner {
    font-size: 22px;
    color: #666;
}

.seo_content_generation_overlay.seo_content_generation_overlay_failed .seo_content_generation_overlay_spinner {
    display: none;
}

.seo_content_generation_overlay.seo_content_generation_overlay_done .seo_content_generation_overlay_spinner {
    display: none;
}

/* Edit page — validation errors summary (popover above Errors button) */
.edit_errors_summary_wrap {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
}

.edit_errors_summary_panel {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 0;
    min-width: 300px;
    max-width: min(420px, 92vw);
    max-height: 350px;
    overflow-y: auto;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    z-index: 110;
    text-align: left;
}

.edit_errors_summary_panel_title {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin: 0 0 8px 0;
}

.edit_errors_summary_list {
    margin: 0;
    padding: 0 0 0 22px;
    list-style: decimal;
    font-size: 14px;
    line-height: 1.45;
    color: #333;
}

.edit_errors_summary_list_item {
    margin-bottom: 6px;
}

.edit_errors_summary_link {
    display: inline;
    margin: 0;
    padding: 0;
    border: none;
    background: none;
    font: inherit;
    font-size: 14px;
    color: #1a73e8;
    text-decoration: underline;
    text-align: left;
    cursor: pointer;
}

.edit_errors_summary_link:hover {
    color: #1557b0;
}

.transformations_utils_sheet_link {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: #1a73e8;
    text-decoration: none;
    margin-bottom: 20px;
}

.transformations_utils_sheet_link:hover {
    text-decoration: underline;
}

.transformations_sync_audience_button,
.transformations_sync_categories_button,
.transformations_sync_firestore_postgres_button,
.transformations_sync_solutions_button {
    min-width: 150px;
    position: relative;
}

.transformations_sync_audience_button i,
.transformations_sync_categories_button i,
.transformations_sync_firestore_postgres_button i,
.transformations_sync_solutions_button i {
    margin-right: 8px;
}

.transformations_sync_audience_button:disabled,
.transformations_sync_categories_button:disabled,
.transformations_sync_firestore_postgres_button:disabled,
.transformations_sync_solutions_button:disabled {
    cursor: not-allowed;
    opacity: 0.7;
    pointer-events: none;
}

.transformations_sync_audience_button_loading,
.transformations_sync_categories_button_loading,
.transformations_sync_firestore_postgres_button_loading,
.transformations_sync_solutions_button_loading {
    opacity: 0.7;
    cursor: not-allowed;
}

.transformations_sync_audience_button i.fa-spin,
.transformations_sync_categories_button i.fa-spin,
.transformations_sync_firestore_postgres_button i.fa-spin,
.transformations_sync_solutions_button i.fa-spin {
    animation: fa-spin 1s infinite linear;
}

@keyframes fa-spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* Result message container */
.transformations_sync_audience_result,
.transformations_sync_categories_result,
.transformations_sync_firestore_postgres_result,
.transformations_sync_solutions_result {
    margin-top: 20px;
    padding: 15px;
    border-radius: 6px;
    font-size: 14px;
    line-height: 1.6;
    display: none;
    animation: transformations_sync_audience_fadeIn 0.3s ease-in;
}

.transformations_sync_audience_result:not(:empty),
.transformations_sync_categories_result:not(:empty),
.transformations_sync_firestore_postgres_result:not(:empty),
.transformations_sync_solutions_result:not(:empty) {
    display: block;
}

.transformations_sync_audience_result_loading,
.transformations_sync_categories_result_loading,
.transformations_sync_firestore_postgres_result_loading,
.transformations_sync_solutions_result_loading {
    background-color: #e3f2fd;
    border: 1px solid #90caf9;
    color: #1976d2;
}

.transformations_sync_audience_result_success,
.transformations_sync_categories_result_success,
.transformations_sync_firestore_postgres_result_success,
.transformations_sync_solutions_result_success {
    background-color: #e8f5e9;
    border: 1px solid #81c784;
    color: #2e7d32;
}

.transformations_sync_audience_result_error,
.transformations_sync_categories_result_error,
.transformations_sync_firestore_postgres_result_error,
.transformations_sync_solutions_result_error {
    background-color: #ffebee;
    border: 1px solid #ef5350;
    color: #c62828;
}

.transformations_sync_audience_result_message,
.transformations_sync_categories_result_message,
.transformations_sync_firestore_postgres_result_message,
.transformations_sync_solutions_result_message {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.transformations_sync_audience_result_main,
.transformations_sync_categories_result_main,
.transformations_sync_firestore_postgres_result_main,
.transformations_sync_solutions_result_main {
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.transformations_sync_audience_result_main i,
.transformations_sync_categories_result_main i,
.transformations_sync_firestore_postgres_result_main i,
.transformations_sync_solutions_result_main i {
    font-size: 16px;
}

.transformations_sync_audience_result_details,
.transformations_sync_categories_result_details,
.transformations_sync_firestore_postgres_result_details,
.transformations_sync_solutions_result_details {
    font-size: 14px;
    color: #555;
    margin-top: 5px;
    padding-top: 8px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.transformations_sync_audience_result_details strong,
.transformations_sync_categories_result_details strong,
.transformations_sync_firestore_postgres_result_details strong,
.transformations_sync_solutions_result_details strong {
    color: #333;
    font-weight: 600;
}

/* Edit page category dropdowns */
.edit_categories_container {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.edit_categories_select {
    width: 100%;
    max-width: none;
    min-height: 38px;
    font-size: 14px;
}

.edit_categories_select option:first-child {
    font-style: italic;
    color: #999;
}

.edit_categories_select_placeholder {
    font-style: italic;
    color: #999;
}

.edit_categories_select_placeholder option:not(:first-child) {
    font-style: normal !important;
    color: #000 !important;
}

.edit_categories_select_loading {
    cursor: progress;
    color: #777;
    background-repeat: no-repeat;
    background-position: calc(100% - 12px) center;
    background-size: 14px 14px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 20 20'%3E%3Cpath fill='%23999' d='M10 0a10 10 0 0 1 0 20 1.4 1.4 0 0 1 0-2.8 7.2 7.2 0 1 0 0-14.4A1.4 1.4 0 0 1 10 0z'/%3E%3C/svg%3E");
}

@keyframes transformations_sync_audience_fadeIn {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Version Audience Multi-Select */
.version_audience_multi_select {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
}

.version_audience_selected {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 30px;
}

.version_audience_tag {
    display: inline-flex;
    align-items: center;
    background-color: #e3f2fd;
    color: #1976d2;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 13px;
    gap: 6px;
}

.version_audience_remove {
    cursor: pointer;
    margin-left: 6px;
    font-size: 12px;
}

.version_audience_remove:hover {
    color: #d32f2f;
}

.version_audience_dropdown_wrapper {
    position: relative;
}

.version_audience_add_btn {
    display: flex;
    padding: 8px 10px;
    align-items: center;
    gap: 4px;
    border-radius: 5px;
    border: 1px solid #1976D2;
    color: #1976D2;
    text-align: center;
    font-family: Helvetica;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 21px;
    background: #FFF;
    cursor: pointer;
}

.version_audience_add_btn:hover {
    background-color: #f5f5f5;
}

.version_audience_dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    min-width: 280px;
    max-height: 400px;
    overflow-y: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #fff;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.version_audience_dropdown_option {
    padding: 8px 12px;
    cursor: pointer;
    font-size: 13px;
    border-bottom: 1px solid #f0f0f0;
}

.version_audience_dropdown_option:last-child {
    border-bottom: none;
}

.version_audience_dropdown_option:hover {
    background-color: #f5f5f5;
}

/* AIT Store Insights: selected list below dropdown (reuses version_audience tag styles) */
.edit_ait_store_insights_selected {
    margin-top: 8px;
}

/* Target Profile: supported target nodes ordered list */
.edit_target_nodes_selected {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.edit_target_nodes_row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    background: #fff;
}

.edit_target_nodes_row_ghost {
    opacity: 0.5;
    background: #f0f0f0;
}

.edit_target_nodes_handle {
    flex-shrink: 0;
    cursor: grab;
    color: #888;
    padding: 2px 4px;
    touch-action: none;
}

.edit_target_nodes_handle:active {
    cursor: grabbing;
}

.edit_target_nodes_number {
    flex-shrink: 0;
    font-weight: 600;
    min-width: 1.5em;
}

.edit_target_nodes_label {
    flex: 1;
    min-width: 0;
}

.edit_target_nodes_remove_button {
    flex-shrink: 0;
    border: none;
    background: transparent;
    color: #666;
    cursor: pointer;
    padding: 2px 6px;
    font-size: 14px;
}

.edit_target_nodes_remove_button:hover {
    color: #333;
}

/* SEO Page Insights / InsightsDB Insights Order: numbered vertical selection list */
.edit_seo_page_insights_selected,
.edit_insights_db_insights_selected {
    margin-top: 8px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.edit_seo_page_insights_row,
.edit_insights_db_insights_row {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 10px;
    border: 1px solid #BFBFBF;
    border-radius: 5px;
    background: #fff;
}

.edit_seo_page_insights_row_ghost,
.edit_insights_db_insights_row_ghost {
    opacity: 0.5;
    background: #f0f0f0;
}

.edit_seo_page_insights_handle,
.edit_insights_db_insights_handle {
    flex-shrink: 0;
    cursor: grab;
    color: #888;
    padding: 2px 4px;
    touch-action: none;
}

.edit_seo_page_insights_handle:active,
.edit_insights_db_insights_handle:active {
    cursor: grabbing;
}

.edit_seo_page_insights_number,
.edit_insights_db_insights_number {
    flex-shrink: 0;
    font-weight: 600;
    min-width: 1.5em;
}

.edit_seo_page_insights_label,
.edit_insights_db_insights_label {
    flex: 1;
    min-width: 0;
}

/**
 * NEW: Readonly Insights Styles
 * Purpose: Visual styling for insights from global collection (non-editable)
 */
.insight_readonly {
    border-radius: 5px;
    border: 1px solid #BFBFBF !important;
    background: #F4F4F4 !important;
    padding: 0;
}

.insight_readonly input,
.insight_readonly textarea,
.insight_readonly select {
    background-color: #F4F4F4 !important;
    cursor: not-allowed !important;
    color: #4A5565 !important;
    border: 1px solid #D1D5DC !important;
    box-shadow: none !important;
    padding: 12px 16px !important;
}

/* Published insight: SEO label/summary stay editable (insights_published_seo); match normal field cursor and surface */
.insight_readonly input.insight_field_seo:not([disabled]),
.insight_readonly textarea.insight_field_seo_summary:not([disabled]) {
    background-color: #ffffff !important;
    cursor: text !important;
    color: #1a1a1a !important;
    border: 1px solid #cbd5e1 !important;
}

/* Override disabled opacity for readonly insights */
.insight_readonly input[disabled],
.insight_readonly textarea[disabled],
.insight_readonly select[disabled] {
    opacity: 1 !important;
}

.insight_readonly .insight_item_header {
    display: flex;
    height: 63px;
    padding: 0 16px;
    align-items: center;
    gap: 12px;
    margin-bottom: 0;
    justify-content: space-between;
}

/* When non-editable insight is expanded, header should be white */
.insight_readonly:not(.collapsed) .insight_item_header {
    background: #FFF;
}

/* When collapsed, header inherits the #F4F4F4 from parent */
.insight_readonly.collapsed .insight_item_header {
    background: #F4F4F4;
}

.insight_readonly .insight_item_header_left {
    gap: 12px;
}

.insight_readonly .insight_item_header_right {
    gap: 12px;
}

.insight_readonly .version_audience_selected {
    opacity: 0.8;
    pointer-events: none;
}

/* NEW: Allow remove button to work for Insight Solutions only (not Audience) in readonly insights */
/* Target only remove buttons within solutions field container that contains input.insight_field_solutions */
.insight_readonly .edit_section_content_item:has(input.insight_field_solutions) .version_audience_selected .version_audience_remove {
    pointer-events: auto;
    cursor: pointer;
}

/* NEW: Bright blue background for solution tags in published (readonly) insights */
.insight_readonly .version_audience_tag {
    background-color: #FFFFFF !important;
}

.insight_readonly_message {
    padding: 10px 12px;
    margin-bottom: 12px;
    background-color: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 4px;
    color: #856404;
    font-size: 13px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.insight_readonly_message i {
    color: #ffc107;
    font-size: 14px;
}

/* Prompt Modal */
.insight_prompt_modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    display: flex;
    justify-content: center;
    align-items: center;
}

.insight_prompt_modal_overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.insight_prompt_modal_content {
    position: relative;
    background: white;
    width: 85%;
    max-width: 1200px;
    max-height: 85vh;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px rgba(0,0,0,0.3);
    z-index: 1;
}

.insight_prompt_modal_header {
    padding: 16px 20px;
    border-bottom: 1px solid #ddd;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.insight_prompt_modal_header h3 {
    margin: 0;
    font-size: 18px;
    color: #333;
}

.insight_prompt_modal_close {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #666;
    padding: 0;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.insight_prompt_modal_close:hover {
    color: #333;
}

.insight_prompt_modal_body {
    padding: 20px 20px 10px 20px;
    overflow-y: auto;
    flex: 1;
}

#insight_edit_publish_modal.insight_edit_publish_modal .insight_prompt_modal_content {
    max-width: 440px;
    width: 90%;
    max-height: none;
}

.insight_edit_publish_modal_message {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: #333;
}

.insight_edit_publish_modal .insight_edit_publish_modal_confirm_btn {
    background-color: #2e7d32;
    border: 1px solid #1b5e20;
}

.insight_edit_publish_modal .insight_edit_publish_modal_confirm_btn:hover {
    background-color: #1b5e20;
}

.insight_edit_publish_modal_body {
    padding: 45px;
}

.insight_edit_publish_modal_footer.edit_universal_insights_modal_footer {
    justify-content: space-between;
}

.edit_insights_add_row {
    display: flex;
    gap: 12px;
    align-items: stretch;
}

.edit_insights_add_row_btn {
    /* flex: 192px;
    width: 100px; */
}

/* Global insights picker modal (transformation edit) */
.edit_universal_insights_modal_content {
    max-width: 560px;
    width: 92%;
    max-height: 80vh;
    min-height: 0;
}

/* Between header and footer: list grows with rows until scroll max-height, then scrolls */
.edit_universal_insights_modal_main {
    display: flex;
    flex-direction: column;
    flex: 0 1 auto;
    min-height: 0;
    overflow: hidden;
}

.edit_universal_insights_modal_scroll {
    flex: 0 1 auto;
    min-height: 120px;
    /* Grow with list until this cap; then scroll (leaves room for header, load-more row, footer) */
    max-height: min(300px, 52vh, calc(80vh - 180px));
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

.edit_universal_insights_modal_scroll .insight_prompt_modal_body,
.edit_universal_insights_modal_scroll .edit_universal_insights_modal_body {
    flex: none;
    overflow: visible;
    min-height: 120px;
}

.edit_universal_insights_modal_load_more_wrap {
    flex-shrink: 0;
    padding: 0 20px;
}

.edit_universal_insights_modal_load_more_wrap:has(.edit_universal_insights_modal_load_more_visible) {
    padding-top: 4px;
    padding-bottom: 12px;
}

.edit_universal_insights_modal_body {
    min-height: 120px;
}

.edit_universal_insights_modal_footer {
    padding: 16px 20px;
    border-top: 1px solid #ddd;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.edit_universal_insights_modal_footer_spacer {
    flex: 1;
    min-width: 8px;
}

/* Plain text-style control (no underline); inside dialog above footer */
.edit_universal_insights_modal_load_more_link {
    display: none;
    margin: 0;
    padding: 0;
    border: none;
    background: none;
    font: inherit;
    font-size: 14px;
    line-height: 1.4;
    color: #1976D2;
    text-decoration: none;
    cursor: pointer;
    vertical-align: baseline;
    text-align: left;
}

.edit_universal_insights_modal_load_more_link:hover:not(:disabled) {
    color: #125ea2;
}

.edit_universal_insights_modal_load_more_link:disabled {
    opacity: 0.55;
    cursor: default;
}

.edit_universal_insights_modal_load_more_link.edit_universal_insights_modal_load_more_visible {
    display: inline;
    font-size: 15px;
}

/* Primary action in modal — must NOT use .transformations_edit_save (delegated to full form save). */
.edit_universal_insights_modal .edit_universal_insights_modal_add_btn {
    background: #1976D2;
    border: 1px solid #1976D2;
    color: #FFF;
}

.edit_universal_insights_modal .edit_universal_insights_modal_add_btn:hover {
    /* background-color: #1b5e20; */
}

.edit_universal_insights_modal_row {
    display: flex;
    /* align-items: flex-start; */
    gap: 10px;
    padding: 10px 0;
    font-size: 14px;
}

.edit_universal_insights_modal_row:last-child {
    border-bottom: none;
}

.edit_universal_insights_modal_row input[type="checkbox"] {
    margin-top: 3px;
    flex-shrink: 0;
}

.edit_universal_insights_modal_row label {
    cursor: pointer;
    flex: 1;
    line-height: 1.4;
}

.edit_universal_insights_modal_edit_link {
    flex-shrink: 0;
    align-self: flex-start;
    margin-top: 2px;
    color: #1976D2;
    text-decoration: none;
    padding: 2px 4px;
    border-radius: 4px;
    line-height: 1;
}

.edit_universal_insights_modal_edit_link:hover {
    color: #0d47a1;
    background-color: rgba(25, 118, 210, 0.08);
}

.edit_universal_insights_modal_edit_link:focus-visible {
    outline: 2px solid #1976D2;
    outline-offset: 2px;
}

.edit_universal_insights_modal_empty {
    margin: 0;
    color: #4A5565;
    font-size: 14px;
}

.edit_column_names_empty_message {
    margin: 0;
    color: #4A5565;
    font-size: 14px;
}

.edit_column_names_table {
    border-collapse: collapse;
    width: 100%;
    font-size: 14px;
}

.edit_column_names_table th,
.edit_column_names_table td {
    border: 1px solid #D1D5DC;
    padding: 10px 14px;
    text-align: left;
}

.edit_column_names_table th {
    background: #E5E7EB;
    color: #364153;
    font-weight: 700;
}

.insight_prompt_text {
    white-space: pre-wrap;
    word-wrap: break-word;
    font-family: 'Courier New', monospace;
    font-size: 14px;
    line-height: 1.6;
    margin: 0;
    color: #333;
}

.insight_prompt_display {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.insight_prompt_section {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 15px;
    background: #f9f9f9;
}

.insight_prompt_section_title {
    margin: 0 0 10px 0;
    font-size: 16px;
    font-weight: bold;
    color: #333;
}

.insight_prompt_section_collapsible .insight_prompt_section_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    user-select: none;
}

.insight_prompt_section_collapsible .insight_prompt_section_title:hover {
    color: #0066cc;
}

.insight_prompt_content {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 15px;
    white-space: pre-wrap;
    word-wrap: break-word;
    font-family: 'Courier New', monospace;
    font-size: 13px;
    line-height: 1.5;
    max-height: 500px;
    overflow-y: auto;
    margin: 0;
    outline: none;
    cursor: text;
}

.insight_prompt_content:focus {
    border-color: #0066cc;
    box-shadow: 0 0 0 2px rgba(0, 102, 204, 0.1);
}

.insight_prompt_content[contenteditable="true"] {
    user-select: text;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
}

/* AIT web search config (edit form) */
.edit_transformations_web_search_select {
    font-size: 14px;
    padding: 6px 8px;
    min-width: 160px;
}

.edit_transformations_web_search_textarea {
    font-size: 14px;
    min-height: 80px;
}

.edit_transformations_web_search_location {
    font-size: 14px;
    display: block;
    margin-bottom: 6px;
    width: 100%;
}

/* AIT web search consulted/cited sources (admin test-run detail) */
.test_run_detail_consulted_sources_list {
    font-size: 14px;
    margin: 0;
    padding-left: 18px;
}

.test_run_detail_consulted_sources_list li {
    margin-bottom: 4px;
    word-break: break-word;
}

/* AI Store Transformations listing view switcher (latest / published / featured / archived) */
.transformations_listing_header_actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.transformations_listing_header_actions .transformations_listing_view_select {
    color: #000000;
    padding: 4px 28px 4px 10px;
    border-radius: 3px;
    cursor: pointer;
    border: 1px solid gray;
    background-color: #D1D6DF;
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23000000' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E"),
        linear-gradient(to bottom, #FFFFFF, #D1D6DF);
    background-repeat: no-repeat, repeat;
    background-position: right 10px center, 0 0;
    background-size: 10px 6px, auto;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    user-select: none;
    font-weight: 500;
    font-size: 16px;
    line-height: normal;
    margin-top: 0;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    white-space: nowrap;
}

.transformations_listing_header_actions .transformations_listing_view_select:focus {
    outline: auto 5px -webkit-focus-ring-color;
}