/**
 * OE Gravity Forms File Upload Fix - Stylesheet
 * Gravity Forms 2.5+ & Elementor Pro 4.2+ Single-File Validation Layout Fix
 */

/* 1. Base styling for container flexbox layout and active preview */
.gform_wrapper .ginput_container.ginput_container_fileupload,
.elementor-widget-gravityforms .ginput_container_fileupload,
div.ginput_container_fileupload {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}

.gform_wrapper .ginput_container_fileupload input[type="file"] {
    order: 1 !important;
}

.gform_wrapper .ginput_container_fileupload .oe-gf-active-preview,
.gform_wrapper .ginput_container_fileupload .oe-gf-active-preview .ginput_preview {
    order: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    margin-top: 2px !important;
    margin-bottom: 2px !important;
    padding: 0 !important;
    box-sizing: border-box;
    line-height: 1.3;
    font-size: 14px;
    color: #2c3338;
}

.gform_wrapper .ginput_container_fileupload .gfield_description,
.gform_wrapper .ginput_container_fileupload span.gfield_description {
    order: 2 !important;
    display: block !important;
    margin-top: 2px !important;
    padding-top: 0px !important;
}

/* 2. Flatly rendered "Choose file" pseudo-button label matching native GF file widget dimensions (mid-grey inactive) */
.oe-gf-active-preview::before {
    content: "Choose file";
    font-weight: 600;
    font-size: 16px;
    color: #ffffff !important;
    background-color: #7f8991ff !important;
    border: 1px solid #5a6268 !important;
    border-radius: 3px;
    padding: 10px 16px;
    margin-right: 14px;
    line-height: 1.3;
    display: inline-block;
    cursor: default !important;
    pointer-events: none !important;
    user-select: none;
    box-shadow: none;
    letter-spacing: -0.1px;
}

/* 3. Ensure filename link/text inside preview matches native font presentation */
.oe-gf-active-preview,
.oe-gf-active-preview a,
.oe-gf-active-preview span,
.oe-gf-active-preview .oe-gf-file-name {
    color: #2c3338 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    text-decoration: none !important;
}

/* 4. Hide percentage/progress text cleanly */
.oe-gf-active-preview .gform_percentage_text,
.oe-gf-active-preview .ginput_file_progress,
.oe-gf-active-preview .ginput_preview_percent,
.oe-gf-active-preview .percent,
.oe-gf-active-preview span[id$="_percent"],
.oe-gf-active-preview .ginput_preview_progress,
.oe-gf-active-preview .gfield_fileupload_progress,
.oe-gf-active-preview .gfield_fileupload_percent {
    display: none !important;
}

/* 5. Style trashcan delete button & SVG icon */
.oe-gf-active-preview .gform_delete,
.oe-gf-active-preview .oe-gf-custom-clear-file {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: 12px !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    cursor: pointer !important;
    vertical-align: middle !important;
    line-height: 1 !important;
}

.oe-gf-trash-icon {
    width: 16px;
    height: 16px;
    stroke: #555555;
    transition: stroke 0.15s ease;
}

.oe-gf-trash-icon:hover {
    stroke: #d9534f;
}

/* 6. Hide native file input element completely when a file is selected */
.oe-gf-hide-native input[type="file"] {
    display: none !important;
}

/* 7. Hide empty validation message containers cleanly */
.gfield_description.validation_message:empty,
.gfield_validation_message:empty,
.validation_message--hidden-on-empty:empty,
div[id^="live_validation_message_"]:empty {
    display: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 0 !important;
}