/**
 * SCYC Form 36 Control CSS
 * Controls visibility of form sections based on ACF flags
 * 
 * Wrapper classes used in Fluent Forms:
 * - scyc-flag-show_require_emergency_contact
 * - scyc-flag-show_require_yacht_details
 * - scyc-flag-show_race_show_dinghy_details
 * - scyc-flag-show_race_show_temporary_moorings
 * - scyc-flag-show_race_show_ratings_block_flag
 * - scyc-flag-show_require_health_safety_declaration
 * - scyc-flag-show_race_require_signature
 * - scyc-mode-race_photo_consent_adult
 * - scyc-mode-race_photo_consent_under18
 * - scyc-mode-race_entry_mode-matrix
 * - scyc-rating-type-irc
 * - scyc-rating-type-ytc
 * - scyc-moorings-sub-arrival_date
 * - scyc-moorings-sub-departure_date
 * - scyc-moorings-sub-yacht_sailing_club
 */

/* =============================================================================
 * FIX: Column Layout on Desktop
 * Force all .ff-t-container elements to use flex row layout on desktop
 * ============================================================================= */
@media (min-width: 768px) {
    /* Force all .ff-t-container elements to maintain flex row layout */
    /* EXCEPT those hidden by flag visibility control */
    .frm-fluent-form .ff-t-container:not([data-flag-show="0"]),
    .fluentform .ff-t-container:not([data-flag-show="0"]) {
        display: flex !important;
        flex-direction: row !important;
        gap: 15px !important;
        width: 100% !important;
    }

    /* Ensure .ff-t-cell children display properly */
    .frm-fluent-form .ff-t-container .ff-t-cell,
    .fluentform .ff-t-container .ff-t-cell {
        display: flex !important;
        /* Allow .ff-t-cell to use its default flex-direction: column */
        width: 100% !important;
        flex: 1 1 0;
        min-width: 0;
    }

    /* Ensure cells don't stack on desktop */
    .frm-fluent-form .ff-t-container .ff-t-cell > .ff-el-group,
    .fluentform .ff-t-container .ff-t-cell > .ff-el-group {
        margin-bottom: 20px;
    }


}

/* Default: Hidden when flag is "0" (No) */
.scyc-flag-show_require_crew_details,
.scyc-flag-show_require_crew_details_additional,
.scyc-flag-show_require_emergency_contact,
.scyc-flag-show_require_yacht_details,
.scyc-flag-show_race_show_dinghy_details,
.scyc-flag-show_race_show_temporary_moorings,
.scyc-flag-show_race_show_ratings_block_flag,
.scyc-flag-show_require_health_safety_declaration,
.scyc-flag-show_race_require_signature,
.scyc-mode-race_photo_consent_adult,
.scyc-mode-race_require_photo_consent_under_18,
.scyc-mode-race_entry_mode-matrix,
.scyc-rating-type-irc,
.scyc-rating-type-ytc,
.scyc-moorings-sub-arrival_date,
.scyc-moorings-sub-departure_date,
.scyc-moorings-sub-yacht_sailing_club {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Shown when flag is "1" (Yes) */
.scyc-flag-show_require_crew_details[data-flag-show="1"],
.scyc-flag-show_require_crew_details_additional[data-flag-show="1"],
.scyc-flag-show_require_emergency_contact[data-flag-show="1"],
.scyc-flag-show_require_yacht_details[data-flag-show="1"],
.scyc-flag-show_race_show_dinghy_details[data-flag-show="1"],
.scyc-flag-show_race_show_temporary_moorings[data-flag-show="1"],
.scyc-flag-show_race_show_ratings_block_flag[data-flag-show="1"],
.scyc-flag-show_require_health_safety_declaration[data-flag-show="1"],
.scyc-flag-show_race_require_signature[data-flag-show="1"],
.scyc-mode-race_photo_consent_adult[data-flag-show="1"],
.scyc-mode-race_require_photo_consent_under_18[data-flag-show="1"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
}

/* Entry mode matrix */
.scyc-mode-race_entry_mode-matrix[data-flag-show="matrix"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
}

/* Rating types */
.scyc-rating-type-irc[data-flag-show="irc"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
}

.scyc-rating-type-ytc[data-flag-show="ytc"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
}

/* Moorings sub-fields */
.scyc-moorings-sub-arrival_date[data-moorings-requested="1"],
.scyc-moorings-sub-departure_date[data-moorings-requested="1"],
.scyc-moorings-sub-yacht_sailing_club[data-moorings-requested="1"] {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    height: auto !important;
}

/* Emergency Contacts - horizontal layout when shown */
.scyc-flag-show_require_emergency_contact[data-flag-show="1"] .ff_g-group-inner {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: center;
}

/* Light theme - horizontal layout for emergency contacts */
.scyc-ticker-light-theme .scyc-flag-show_require_emergency_contact[data-flag-show="1"] .ff_g-group-inner {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px 16px;
    align-items: center;
}