/**
 * Frontend Forms v4.3.1 - Styles
 * Fixes:
 * 1. Enhanced preview styles
 * 2. Sticky button styling
 * 3. Fixed button position
 * 4. Validation styles
 */

/* ================================================================
 * BASE STYLES
 * ================================================================*/
.fef-registration-form {
    --fef-primary: #667eea;
    --fef-primary-dark: #5a6fd6;
    --fef-success: #388e3c;
    --fef-error: #d32f2f;
    --fef-warning: #f57c00;
    --fef-border: #e0e0e0;
    --fef-bg: #fafafa;
    --fef-text: #333;
    --fef-text-light: #666;
    --fef-floating-bg: #1a1a2e;
    --fef-floating-bg-end: #16213e;
    --fef-form-height: 500px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    max-width: 1200px;
    margin: 0 auto;
}

.fef-form-container {
    display: flex;
    gap: 30px;
    align-items: flex-start;
}

.fef-form-wrapper {
    flex: 1;
    background: #fff;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
}

/* ================================================================
 * MOBILE RESPONSIVE — 768px and below
 * ================================================================*/
@media (max-width: 768px) {
    /* Hide live preview panel completely */
    .fef-preview-panel,
    .fef-google-preview,
    .fef-preview-restore {
        display: none !important;
    }

    /* Hide step progress bar */
    .fef-progress-bar {
        display: none !important;
    }

    /* Form container: stack vertically */
    .fef-form-container {
        flex-direction: column;
    }
    .fef-form {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* All form field columns go full width */
    .fef-col-25,
    .fef-col-33,
    .fef-col-50,
    .fef-col-66,
    .fef-col-75 {
        width: 100% !important;
        padding-right: 0 !important;
    }
    .fef-form-group {
        width: 100% !important;
        display: block !important;
        padding-right: 0 !important;
    }

    /* Repeater fields: all sub-fields stack full width */
    .fef-repeater-fields {
        display: block !important;
    }
    .fef-repeater-fields .fef-form-group {
        width: 100% !important;
        display: block !important;
        margin-bottom: 10px;
    }
    .fef-repeater-item {
        padding: 10px !important;
    }

    /* Working hours table: stack each row */
    .fef-wh-row {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        padding: 12px !important;
    }
    .fef-wh-table-header {
        display: none !important;
    }
    .fef-wh-times {
        flex-direction: column;
        gap: 6px;
    }
    .fef-wh-time-sep {
        display: none;
    }
    .fef-wh-time-input {
        width: 100% !important;
    }

    /* Social links: stack */
    .fef-social-row {
        grid-template-columns: 1fr 32px !important;
        gap: 6px;
    }
    .fef-social-icon-cell {
        display: none;
    }
    .fef-social-platform,
    .fef-social-url {
        grid-column: 1;
    }
    .fef-social-remove {
        grid-row: 1;
        grid-column: 2;
    }

    /* Branch/contacts/services repeater grids */
    .fef-branch-repeater .fef-repeater-fields,
    .fef-repeater-type-contacts .fef-repeater-fields,
    .fef-repeater-type-services .fef-repeater-fields {
        grid-template-columns: 1fr !important;
        display: block !important;
    }

    /* Image uploads: full width */
    .fef-rp-image-upload,
    .fef-rp-gallery-upload,
    .fef-media-upload,
    .fef-gallery-upload {
        width: 100% !important;
    }

    /* Step navigation buttons */
    .fef-step-navigation {
        flex-direction: column;
        gap: 8px;
    }
    .fef-step-navigation .fef-btn {
        width: 100%;
        justify-content: center;
    }

    /* Accordion form panels */
    .fef-accordion-panel .fef-accordion-body {
        padding: 10px !important;
    }

    /* Field with icon: reduce padding */
    .fef-field-with-icon.fef-icon-left .fef-form-control {
        padding-left: 45px !important;
    }

    /* WYSIWYG editor */
    .fef-form-group .wp-editor-wrap {
        width: 100%;
    }

    /* Heading field */
    .fef-heading {
        font-size: 16px;
        padding: 6px;
        margin: 18px 0 12px;
    }

    /* Holiday fields */
    .fef-wh-holiday-fields {
        grid-template-columns: 1fr !important;
    }
    .fef-wh-holiday-remove {
        justify-self: end;
    }

    /* Repeater item title: smaller on mobile */
    .fef-repeater-item-title {
        font-size: 16px;
    }

    /* Data table mobile */
    .fef-dt-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .fef-dt-toolbar-l,
    .fef-dt-toolbar-r {
        justify-content: center;
    }
    .fef-dt-search-inp {
        width: 100% !important;
    }
    .fef-dt-search-inp:focus {
        width: 100% !important;
    }
}

/* ================================================================
 * MULTI-STEP BUTTON STYLES - FIXED
 * ================================================================*/

/* Style 1: Flow (Default) */
.fef-buttons-flow .fef-step-navigation {
    display: flex;
    gap: 15px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 20px;
    position: relative;
}

/* Skip this Step link */
.fef-skip-step {
    color: #eb8110;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: color 0.15s;
}
.fef-skip-step:hover {
    color: #d97706;
    text-decoration: underline;
}

/* Style 2: Fixed (Scrollable form with fixed buttons at bottom) */
/* The class is on .fef-multistep-form which is inside .fef-form-wrapper */
.fef-form-wrapper:has(.fef-buttons-fixed) {
    display: flex;
    flex-direction: column;
    height: var(--fef-form-height, 500px);
    max-height: var(--fef-form-height, 500px);
    overflow: hidden;
    position: relative;
}

/* Fallback for browsers without :has() support */
.fef-fixed-height {
    display: flex;
    flex-direction: column;
    height: var(--fef-form-height, 500px);
    max-height: var(--fef-form-height, 500px);
    overflow: hidden;
    position: relative;
}

.fef-buttons-fixed {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

.fef-buttons-fixed .fef-steps-container,
.fef-buttons-fixed .fef-step {
    flex: 1;
    overflow-y: auto;
    padding-right: 10px;
    padding-bottom: 20px;
}

.fef-buttons-fixed .fef-step::-webkit-scrollbar,
.fef-buttons-fixed .fef-steps-container::-webkit-scrollbar {
    width: 6px;
}

.fef-buttons-fixed .fef-step::-webkit-scrollbar-track,
.fef-buttons-fixed .fef-steps-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.fef-buttons-fixed .fef-step::-webkit-scrollbar-thumb,
.fef-buttons-fixed .fef-steps-container::-webkit-scrollbar-thumb {
    background: var(--fef-primary);
    border-radius: 3px;
}

.fef-buttons-fixed .fef-step-navigation {
    flex-shrink: 0;
    display: flex;
    gap: 15px;
    justify-content: flex-end;
    padding: 15px 0;
    border-top: 1px solid var(--fef-border);
    background: #fff;
    margin-top: auto;
}

/* Style 3: Sticky (Floating bottom bar) */
body.fef-has-sticky-buttons {
    padding-bottom: 100px;
}

.fef-buttons-sticky .fef-step-navigation {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    gap: 15px;
    justify-content: center;
    padding: 15px 30px;
    background: linear-gradient(135deg, var(--fef-floating-bg, #1a1a2e) 0%, var(--fef-floating-bg-end, #16213e) 100%);
    box-shadow: 0 -4px 20px rgba(0,0,0,.15);
    z-index: 9999;
}

.fef-buttons-sticky .fef-step-navigation::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--fef-primary), #764ba2, var(--fef-primary));
}

.fef-buttons-sticky .fef-btn-prev,
.fef-buttons-sticky .fef-btn-next {
    min-width: 150px;
    padding: 14px 40px;
    font-size: 16px;
    border-radius: 30px;
    transition: all 0.3s ease;
    cursor: pointer;
    font-weight: 500;
}

.fef-buttons-sticky .fef-btn-prev {
    background: transparent;
    border: 2px solid rgba(255,255,255,.3);
    color: #fff;
}

.fef-buttons-sticky .fef-btn-prev:hover {
    background: rgba(255,255,255,.1);
    border-color: rgba(255,255,255,.5);
    transform: translateY(-2px);
}

.fef-buttons-sticky .fef-btn-next {
    background: linear-gradient(135deg, var(--fef-primary), #764ba2);
    border: none;
    color: #fff;
    box-shadow: 0 4px 15px rgba(102,126,234,.4);
}

.fef-buttons-sticky .fef-btn-next:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102,126,234,.5);
}

.fef-buttons-sticky .fef-submit-btn {
    min-width: 200px;
    padding: 14px 50px;
    font-size: 16px;
    border-radius: 30px;
    background: linear-gradient(135deg, #11998e, #38ef7d);
    border: none;
    color: #fff;
    font-weight: 600;
    transition: all 0.3s ease;
}

.fef-buttons-sticky .fef-submit-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(17,153,142,.5);
}

.fef-floating-progress {
    position: fixed;
    bottom: 70px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,.8);
    color: #fff;
    padding: 8px 20px;
    border-radius: 20px;
    font-size: 13px;
    z-index: 9998;
    display: none;
}

.fef-buttons-sticky .fef-floating-progress {
    display: block;
}

/* ================================================================
 * FORM GROUPS
 * ================================================================*/
.fef-form-group {
    margin-bottom: 20px;
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
    padding-right: 15px;
}
.fef-col-25 { width: 25%; }
.fef-col-33 { width: 33.33%; }
.fef-col-50 { width: 50%; }
.fef-col-66 { width: 66.66%; }
.fef-col-75 { width: 75%; }
.fef-col-100 { width: 100%; padding-right: 0; }

.fef-form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: var(--fef-text);
    font-size: 14px;
}
.fef-label-icon { margin-right: 6px; color: var(--fef-primary); }
.fef-required { color: var(--fef-error); }

/* ================================================================
 * FORM CONTROLS
 * ================================================================*/
.fef-form-control {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid var(--fef-border);
    border-radius: 8px;
    font-size: 15px;
    transition: all .2s ease;
    box-sizing: border-box;
}
.fef-form-control:focus {
    outline: none;
    border-color: var(--fef-primary);
    box-shadow: 0 0 0 3px rgba(102,126,234,.15);
}
.fef-form-control.fef-invalid, 
.fef-form-control.fef-field-error {
    border-color: var(--fef-error);
    background: #fff5f5;
}

textarea.fef-form-control { resize: vertical; min-height: 100px; }

/* ================================================================
 * PROGRESS BAR - HORIZONTAL INLINE
 * ================================================================*/
.fef-progress-bar {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    gap: 0;
    position: relative;
    width: 100%;
}

.fef-progress-bar .fef-progress-step {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    z-index: 1;
    max-width: 150px;
    min-width: 60px;
    cursor: pointer;
}
.fef-progress-bar .fef-progress-step:hover span {
    transform: scale(1.1);
}

.fef-progress-bar .fef-progress-step span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all .3s ease;
}

.fef-progress-bar .fef-step-title {
    margin-top: 8px;
    white-space: nowrap;
}

/* Connector line - position controlled by Elementor */
.fef-progress-bar::before {
    content: "";
    position: absolute;
    left: 15%;
    right: 15%;
    z-index: 0;
}

/* ================================================================
 * TYPEWRITER PLACEHOLDER EFFECT
 * ================================================================*/
.fef-typewriter-field::placeholder {
    color: #666666;
    font-size: 21px;
    font-weight: 200;
    opacity: 1;
    transition: color 0.2s;
}

.fef-typewriter-field:focus::placeholder {
    opacity: 0.7;
}

.fef-typewriter-field {
    padding: 14px 18px;
    line-height: 1.3;
}

.fef-typewriter-field:not(:placeholder-shown) {
    color: #111111;
    font-size: 26px;
    font-weight: 600;
}

/* ================================================================
 * FIELD WITH ICON INSIDE
 * ================================================================*/
.fef-field-with-icon {
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
}

.fef-field-with-icon .fef-form-control {
    flex: 1;
    width: 100%;
}

.fef-field-with-icon.fef-icon-left .fef-form-control {
    padding-left: 60px !important;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.fef-field-with-icon.fef-icon-right .fef-form-control {
    padding-right: 50px !important;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.fef-field-icon-inside {
    position: absolute;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 45px;
    padding: 0 12px;
    font-size: 15px;
    font-weight: 500;
    z-index: 2;
    margin: 1px;
}

.fef-field-icon-inside.fef-icon-left {
    left: 0;
    border-right: none;
}

.fef-field-icon-inside.fef-icon-right {
    right: 0;
    border-left: none;
}

.fef-field-icon-inside i,
.fef-field-icon-inside svg {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ================================================================
 * HOVER ANIMATION EFFECTS - NO CROPPING
 * ================================================================*/
/* Parent must have overflow visible for scale to work without cropping */
.fef-form-group {
    position: relative;
    overflow: visible !important;
}

.fef-hover-animated {
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
    transform-origin: center center;
}

/* Use box-shadow for "glow" effect instead of scale to avoid cropping */
.fef-hover-animated:hover {
    box-shadow: var(--fef-hover-shadow, 0 0 0 3px rgba(102,126,234,0.15)) !important;
    border-color: var(--fef-hover-border, #667eea) !important;
}

.fef-hover-animated:focus {
    border-color: var(--fef-hover-border, #667eea) !important;
    box-shadow: var(--fef-hover-shadow, 0 0 0 3px rgba(102,126,234,0.2)) !important;
}

/* Optional scale effect - only apply when explicitly enabled */
.fef-hover-scale-enabled:hover {
    transform: scale(var(--fef-hover-scale, 1.02));
    z-index: 5;
}

/* ================================================================
 * VALIDATION TICK MARK
 * ================================================================*/
/* Tick is positioned inside/outside the field by JS based on data-tick-pos.
   Color/size/bg are applied as inline styles by JS (CSS vars can't
   cross from input element to sibling span). */
.fef-has-validation-tick {
    padding-right: 40px !important;
}

.fef-validation-tick {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    font-weight: bold;
    opacity: 0;
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
    z-index: 10;
    /* color, background, size, padding, margin set via inline style by JS */
}

/* Tick appears when the input is valid */
.fef-form-control.fef-valid ~ .fef-validation-tick,
.fef-field-with-icon .fef-form-control.fef-valid ~ .fef-validation-tick {
    opacity: 1;
    transform: translateY(-50%) scale(1.1);
}

/* Position variants injected by JS via data-tick-pos class */
.fef-tick-pos-outside-right .fef-validation-tick,
.fef-form-group.fef-tick-pos-outside-right > .fef-validation-tick {
    position: absolute;
    right: -32px;
    top: 50%;
    transform: translateY(-50%);
}
.fef-tick-pos-outside-left .fef-validation-tick,
.fef-form-group.fef-tick-pos-outside-left > .fef-validation-tick {
    position: absolute;
    left: -32px;
    right: auto;
    top: 50%;
    transform: translateY(-50%);
}
.fef-tick-pos-below .fef-validation-tick,
.fef-form-group.fef-tick-pos-below > .fef-validation-tick {
    position: static;
    display: block;
    transform: none;
    margin-top: 4px;
}

/* Input valid state border */
.fef-form-control.fef-valid {
    border-color: #388e3c !important;
    background: #f8fff8;
}
.fef-form-control.fef-invalid {
    border-color: #d32f2f !important;
}

/* Icon-inside field offset for tick */
.fef-field-with-icon .fef-validation-tick {
    right: 55px;
}

/* ================================================================
 * VALIDATION ERRORS
 * ================================================================*/
.fef-validation-error {
    color: var(--fef-error);
    font-size: 12px;
    margin-top: 5px;
    display: block;
}

/* ================================================================
 * CLOSE BUTTON FIXES - All Close/Remove Buttons
 * ================================================================*/
/* Preview Panel Close Button */
.fef-preview-panel {
    position: relative;
}

.fef-preview-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 20px;
}

.fef-preview-toggle {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    background: #fefefe;
    border: 1px solid #bababa;
    font-size: 15px;
    color: #666;
    cursor: pointer;
    padding: 0;
    width: 28px;
    height: 28px;
    min-width: 28px;
    line-height: 28px;
    text-align: center;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    flex-shrink: 0;
    margin-left: auto;
}

.fef-preview-toggle:hover {
    color: #333;
    background: #e0e0e0;
    border-color: #ccc;
}

/* Image Preview Remove Button */
.fef-media-preview,
.fef-gallery-item {
    position: relative;
    display: inline-block;
}

.fef-media-remove,
.fef-gallery-remove {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 24px;
    height: 24px;
    background: #d32f2f;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    transition: all 0.2s;
    z-index: 10;
}

.fef-media-remove:hover,
.fef-gallery-remove:hover {
    background: #b71c1c;
    transform: scale(1.1);
}

/* Cropper Close Button */
.fef-cropper-close {
    width: 32px;
    height: 32px;
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 20px;
    color: #666;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
    transition: all 0.2s;
}

.fef-cropper-close:hover {
    background: #e0e0e0;
    color: #333;
}

/* Calendar Popup Close */
.fef-cal-popup-close {
    width: 28px;
    height: 28px;
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 18px;
    color: #666;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

/* ================================================================
 * PREVIEW STYLES - Shows all fields
 * ================================================================*/

/* Simple Preview Styles */
.fef-simple-preview {
    padding: 20px;
    background: #fff;
}

.fef-simple-preview h4 {
    margin: 0 0 15px 0;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--fef-primary);
    color: var(--fef-text);
    font-size: 16px;
    font-weight: 600;
}

.fef-sp-row {
    display: flex;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #f0f0f0;
    align-items: flex-start;
}

.fef-sp-label {
    font-weight: 600;
    color: var(--fef-text);
    width: 40%;
    min-width: 140px;
    font-size: 13px;
    padding-right: 10px;
}

.fef-sp-value {
    color: var(--fef-text-light);
    flex: 1;
    font-size: 13px;
    line-height: 1.5;
}

/* Google Preview Additional Fields */
.fef-gp-all-fields {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #f0f0f0;
}

.fef-gp-all-title {
    font-weight: 600;
    color: #5f6368;
    font-size: 14px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f5f5f5;
}

.fef-gp-field-item {
    display: flex;
    margin-bottom: 8px;
    font-size: 13px;
    line-height: 1.4;
}

.fef-gp-field-label {
    font-weight: 500;
    color: #5f6368;
    width: 40%;
    min-width: 120px;
    padding-right: 10px;
}

.fef-gp-field-value {
    color: #202124;
    flex: 1;
    word-break: break-word;
}

/* Google Preview Main Styles */
.fef-preview-panel {
    position: sticky;
    top: 20px;
    width: 400px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
    overflow: hidden;
}

.fef-preview-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: var(--fef-bg);
    border-bottom: 1px solid var(--fef-border);
}
.fef-preview-header h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--fef-text);
}
.fef-preview-toggle {
    width: 28px;
    height: 28px;
    background: #fff;
    border: 1px solid var(--fef-border);
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    color: var(--fef-text-light);
}

.fef-google-preview {
    padding: 20px;
    font-family: Arial, sans-serif;
    max-height: 600px;
    overflow-y: auto;
}

.fef-google-preview::-webkit-scrollbar {
    width: 6px;
}

.fef-google-preview::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.fef-google-preview::-webkit-scrollbar-thumb {
    background: var(--fef-primary);
    border-radius: 3px;
}

.fef-gp-card { background: #fff; }

.fef-gp-images {
    margin-bottom: 15px;
    border-radius: 8px;
    overflow: hidden;
}
.fef-gp-main-image {
    background: #f3f4f6;
    border-radius: 8px 8px 0 0;
}
.fef-gp-main-image img {
    width: 100%;
    height: 200px;
    object-fit: contain;
    display: block;
}
.fef-gp-slider { position: relative; overflow: hidden; border-radius: 8px 8px 0 0; }
.fef-gp-slides {
    position: relative;
    height: 200px;
    overflow: hidden;
    background: #f3f4f6;
}
.fef-gp-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transform: scale(1.02);
    transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}
.fef-gp-slide.active {
    opacity: 1;
    transform: scale(1);
    pointer-events: auto;
    z-index: 2;
}
.fef-gp-slide.slide-exit {
    opacity: 0;
    transform: scale(0.98);
    z-index: 1;
}
.fef-gp-slide img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.fef-gp-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    background: rgba(255,255,255,.92);
    border: none;
    border-radius: 50%;
    cursor: pointer;
    font-size: 20px;
    font-weight: 300;
    z-index: 10;
    box-shadow: 0 2px 10px rgba(0,0,0,.12);
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1e293b;
    line-height: 1;
    opacity: 0;
}
.fef-gp-slider:hover .fef-gp-arrow { opacity: 1; }
.fef-gp-arrow:hover {
    background: #fff;
    box-shadow: 0 4px 14px rgba(0,0,0,.18);
    transform: translateY(-50%) scale(1.08);
}
.fef-gp-prev { left: 8px; }
.fef-gp-next { right: 8px; }
.fef-gp-dots {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 6px;
    z-index: 10;
}
.fef-gp-dot {
    width: 8px;
    height: 8px;
    background: rgba(255,255,255,.4);
    border-radius: 50%;
    cursor: pointer;
    transition: all .3s ease;
}
.fef-gp-dot.active { background: #fff; transform: scale(1.3); }
.fef-gp-dot:hover { background: rgba(255,255,255,.8); }
/* Slide counter badge */
.fef-gp-counter {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0,0,0,.5);
    color: #fff;
    font-size: 11px;
    font-weight: 500;
    padding: 2px 8px;
    border-radius: 10px;
    z-index: 10;
}

.fef-gp-content { font-size: 14px; }

.fef-gp-url {
    display: flex;
    align-items: center;
    margin-bottom: 6px;
    font-size: 12px;
}
.fef-gp-favicon { font-size: 14px; margin-right: 8px; }
.fef-gp-domain { color: #202124; }
.fef-gp-url-sep { color: #5f6368; }
.fef-gp-url-slug { color: #1a0dab; font-weight: 600; }
.fef-gp-path { color: #5f6368; }

.fef-gp-title {
    font-size: 20px;
    line-height: 1.3;
    color: #1a0dab;
    margin: 0 0 8px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.fef-gp-title:hover { text-decoration: underline; }

.fef-gp-description {
    font-size: 14px;
    line-height: 1.58;
    color: #4d5156;
    margin: 0 0 12px;
}

.fef-gp-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
}
.fef-gp-meta-item {
    display: flex;
    align-items: center;
    font-size: 13px;
    color: var(--fef-text);
}
.fef-gp-meta-item .fef-icon {
    margin-right: 6px;
    font-style: normal;
}

/* ================================================================
 * SUCCESS SCREEN - Hide form on submit
 * ================================================================*/
.fef-success-screen {
    display: none;
    text-align: center;
    padding: 40px 20px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
}

.fef-registration-form.show-success .fef-form { display: none; }
.fef-registration-form.show-success .fef-progress-bar { display: none; }
.fef-registration-form.show-success .fef-success-screen { display: block; }

.fef-success-icon { 
    font-size: 64px; 
    color: var(--fef-success, #388e3c); 
    margin-bottom: 20px; 
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 64px;
}

.fef-success-icon i,
.fef-success-icon svg {
    display: block !important;
}

.fef-success-icon svg.fef-success-svg {
    width: 64px !important;
    height: 64px !important;
    color: inherit;
    stroke: currentColor;
}

/* Summary Screen */
.fef-summary-screen {
    display: none;
    padding: 30px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
}

.fef-registration-form.show-summary .fef-form { display: none; }
.fef-registration-form.show-summary .fef-progress-bar { display: none; }
.fef-registration-form.show-summary .fef-accordion-container { display: none; }
.fef-registration-form.show-summary .fef-summary-screen { display: block; }

.fef-summary-content {
    margin-bottom: 25px;
}

.fef-summary-card {
    background: #fff;
    border-radius: 10px;
    padding: 20px;
}

.fef-summary-footer {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid var(--fef-border);
}

.fef-summary-continue-btn {
    padding: 14px 40px;
    background: var(--fef-primary);
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.fef-summary-continue-btn:hover {
    background: var(--fef-primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(102,126,234,.4);
}

/* Field Icons in Preview/Summary */
.fef-gp-field-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    color: #4caf50;
    font-size: 14px;
}

.fef-gp-field-icon::before {
    content: "✓";
}

.fef-gp-field-item {
    display: flex;
    align-items: flex-start;
    padding: 8px 0;
}

.fef-sp-row {
    display: flex;
    align-items: flex-start;
    padding: 8px 0;
}

/* Preview Header Icon */
.fef-preview-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 20px;
    background: #fafafa;
    border-bottom: 1px solid var(--fef-border);
    position: relative;
}

.fef-preview-header-icon {
    font-size: 18px;
    color: var(--fef-primary);
    display: flex;
    align-items: center;
}

.fef-preview-header h4 {
    flex: 1;
    margin: 0;
    font-size: 15px;
    font-weight: 600;
}

/* ================================================================
 * CLOSE/TOGGLE BUTTONS - UNIFIED STYLES
 * ================================================================*/
.fef-preview-toggle,
.fef-media-remove,
.fef-gallery-remove,
.fef-cropper-close {
    position: absolute;
    background: #f5f5f5;
    border: 1px solid #d0d0d0;
    color: #666;
    cursor: pointer;
    padding: 0;
    width: 24px;
    height: 24px;
    line-height: 24px;
    font-size: 14px;
    font-weight: 400;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    transition: all 0.2s;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 4px;
    z-index: 10;
    box-sizing: border-box;
}

.fef-preview-toggle:hover,
.fef-media-remove:hover,
.fef-gallery-remove:hover,
.fef-cropper-close:hover {
    color: #fff;
    background: #d32f2f;
    border-color: #d32f2f;
    transform: scale(1.05);
}

/* Preview Panel Close Button */
.fef-preview-toggle {
    top: 10px;
    right: 10px;
    background: #fff;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.1);
}

/* Media Remove Button */
.fef-media-remove,
.fef-gallery-remove {
    top: -10px;
    right: -10px;
    background: #d32f2f;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    font-size: 14px;
    box-shadow: 0 2px 6px rgba(0,0,0,.2);
}

.fef-media-remove:hover,
.fef-gallery-remove:hover {
    background: #b71c1c;
    transform: scale(1.1);
}

/* Preview Panel Header with relative positioning for toggle */
.fef-preview-header {
    position: relative;
    padding-right: 40px;
    display: flex;
    align-items: center;
}

.fef-preview-toggle-icon {
    font-size: 12px;
    line-height: 1;
}

/* Input Limit Reached */
.fef-limit-counter.fef-limit-reached {
    background: #ffebee;
    color: #c62828;
}

input.fef-limit-full,
textarea.fef-limit-full {
    border-color: #ef9a9a !important;
    background-color: #fff8f8 !important;
}

.fef-success-title { 
    font-size: 22px; 
    color: var(--fef-text); 
    margin-bottom: 8px; 
    font-weight: 600;
}

.fef-success-description { 
    font-size: 14px; 
    color: var(--fef-text-light); 
    margin-bottom: 20px; 
    line-height: 1.5;
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.fef-success-btn,
.fef-new-registration-btn {
    padding: 8px 20px;
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s ease;
    display: inline-block;
}

.fef-success-btn:hover,
.fef-new-registration-btn:hover {
    background: #e5e7eb;
    border-color: #9ca3af;
    color: #111827;
}

/* ================================================================
 * MULTI-STEP PROGRESS BAR - HORIZONTAL INLINE DISPLAY
 * ================================================================*/
.fef-multi-step-progress {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 0 !important;
    margin-bottom: 30px;
    position: relative;
    width: 100%;
}

.fef-multi-step-progress::before {
    content: "";
    position: absolute;
    top: 16px;
    left: 10%;
    right: 10%;
    height: 3px;
    background: var(--fef-border, #e0e0e0);
    z-index: 0;
}

.fef-progress-step {
    text-align: center;
    position: relative;
    z-index: 1;
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    max-width: 150px;
    min-width: 80px;
}

.fef-progress-step span {
    width: 32px;
    height: 32px;
    background: #fff;
    border: 2px solid var(--fef-border, #e0e0e0);
    border-radius: 50%;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    color: var(--fef-text-light, #666);
    transition: all .3s;
    flex-shrink: 0;
}

.fef-progress-step.active span, 
.fef-progress-step.completed span {
    background: var(--fef-primary, #667eea);
    border-color: var(--fef-primary, #667eea);
    color: #fff;
}

.fef-progress-step.completed span {
    background: var(--fef-success, #388e3c);
    border-color: var(--fef-success, #388e3c);
}

.fef-step-title {
    font-size: 12px;
    color: var(--fef-text-light, #666);
    margin-top: 8px;
    white-space: nowrap;
}

.fef-progress-step.active .fef-step-title {
    color: var(--fef-primary, #667eea);
    font-weight: 500;
}

.fef-step { display: none; }
.fef-step.active { display: block; }

/* ================================================================
 * STEP SLIDE ANIMATION
 * ================================================================*/
.fef-multistep-form.fef-animate-steps {
    overflow: hidden;
}

.fef-multistep-form.fef-animate-steps .fef-step {
    display: none;
    opacity: 0;
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s ease;
}

.fef-multistep-form.fef-animate-steps .fef-step.active {
    display: block;
    opacity: 1;
    transform: translateX(0);
}

.fef-multistep-form.fef-animate-steps .fef-step.slide-out-left {
    display: block;
    opacity: 0;
    transform: translateX(-100%);
}

.fef-multistep-form.fef-animate-steps .fef-step.slide-out-right {
    display: block;
    opacity: 0;
    transform: translateX(100%);
}

.fef-multistep-form.fef-animate-steps .fef-step.slide-in-left {
    transform: translateX(-100%);
}

.fef-multistep-form.fef-animate-steps .fef-step.slide-in-right {
    transform: translateX(100%);
}

/* Steps container for animation */
.fef-steps-wrapper {
    position: relative;
    overflow: hidden;
}

/* ================================================================
 * REPEATER FIELD STYLES
 * ================================================================*/
.fef-repeater-field {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    padding: 10px;
    margin-bottom: 12px;
}

.fef-repeater-items {
    margin-bottom: 8px;
}

.fef-repeater-item {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 7px;
    position: relative;
    transition: box-shadow 0.2s ease;
}

.fef-repeater-item:hover {
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

.fef-repeater-item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid #f3f4f6;
}

.fef-repeater-item-title {
    font-weight: 300;
    color: #374151;
    font-size: 20px;
}

.fef-repeater-item-actions {
    display: flex;
    gap: 4px;
}

.fef-repeater-remove {
    background: #1f2937;
    color: #fff;
    border: none;
    width: 28px;
    height: 28px;
    min-width: 28px;
    padding: 0;
    border-radius: 50%;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.fef-repeater-remove:hover {
    background: #dc2626;
    color: #fff;
}

.fef-repeater-fields .fef-form-group {
    margin-bottom: 0;
}

.fef-repeater-add {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 7px 14px;
    background: #fff;
    border: 1px dashed #d1d5db;
    border-radius: 6px;
    color: #6b7280;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.fef-repeater-add:hover {
    background: #f9fafb;
    border-color: #9ca3af;
    color: #374151;
}

.fef-repeater-add i {
    font-size: 13px;
}

/* ================================================================
 * REPEATER — COLUMN GRID SYSTEM
 * --rp-cols is set by Elementor style controls + JS.
 * When 'auto' is selected, field.width percentages control layout (flex).
 * When a number 1-4 is selected, CSS grid takes over.
 * ================================================================*/

/* Compact inputs inside repeater items */
.fef-repeater-item .fef-form-control {
    padding: 6px 10px;
    font-size: 13px;
    border-radius: 5px;
}
.fef-repeater-item textarea.fef-form-control {
    min-height: 50px;
}
.fef-repeater-item .fef-form-group label {
    font-size: 11px;
    margin-bottom: 2px;
    color: #6b7280;
    font-weight: 500;
}
.fef-repeater-item select.fef-form-control {
    padding: 5px 8px;
    font-size: 13px;
}

/* Default: flex wrap (auto mode) — fields use their own width % */
.fef-repeater-fields {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Column mode: when --rp-cols is set to a number, switch to grid */
.fef-repeater-fields[style*="--rp-cols:1"],
.fef-repeater-fields[style*="--rp-cols: 1"] {
    display: grid;
    grid-template-columns: 1fr;
}
.fef-repeater-fields[style*="--rp-cols:2"],
.fef-repeater-fields[style*="--rp-cols: 2"] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
.fef-repeater-fields[style*="--rp-cols:3"],
.fef-repeater-fields[style*="--rp-cols: 3"] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
.fef-repeater-fields[style*="--rp-cols:4"],
.fef-repeater-fields[style*="--rp-cols: 4"] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

/* When grid is active, stretch all child groups to fill cell */
.fef-repeater-fields[style*="--rp-cols"] .fef-form-group {
    width: 100% !important;
    flex: none;
}

/* Elementor-generated CSS: --rp-cols via :root or wrapper var */
@supports (grid-template-columns: repeat(var(--rp-cols, 1), 1fr)) {
    .fef-repeater-fields:not([style*="--rp-cols:auto"]) {
        display: grid;
        grid-template-columns: repeat(var(--rp-cols, auto-fill), 1fr);
    }
}

/* Title icon badge */
.fef-repeater-item-title .fef-rp-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 6px;
    font-size: 14px;
    line-height: 1;
    vertical-align: middle;
    transition: all 0.2s;
}

/* Working Hours: clean fixed-row table (no per-day add/remove) */
.fef-working-hours-repeater .fef-repeater-items {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 10px;
}
.fef-working-hours-repeater .fef-repeater-add {
    display: none !important;
}

/* Branch: default 2-column grid */
.fef-branch-repeater .fef-repeater-fields:not([style*="--rp-cols"]) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.fef-branch-repeater .fef-repeater-fields:not([style*="--rp-cols"]) .fef-form-group {
    width: 100% !important;
}

/* Social links: default 2-column */
.fef-repeater-type-social_links .fef-repeater-fields:not([style*="--rp-cols"]) {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 10px;
}
.fef-repeater-type-social_links .fef-repeater-fields:not([style*="--rp-cols"]) .fef-form-group {
    width: 100% !important;
}

/* Contacts: default 2-column */
.fef-repeater-type-contacts .fef-repeater-fields:not([style*="--rp-cols"]) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.fef-repeater-type-contacts .fef-repeater-fields:not([style*="--rp-cols"]) .fef-form-group {
    width: 100% !important;
}

/* Services: default 2-column */
.fef-repeater-type-services .fef-repeater-fields:not([style*="--rp-cols"]) {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 12px;
}
.fef-repeater-type-services .fef-repeater-fields:not([style*="--rp-cols"]) .fef-form-group {
    width: 100% !important;
}
/* Description spans full width */
.fef-repeater-type-services .fef-repeater-fields:not([style*="--rp-cols"]) .fef-form-group:last-child {
    grid-column: 1 / -1;
}

/* ================================================================
 * SMALL MOBILE — 600px and below
 * ================================================================*/
@media (max-width: 600px) {
    /* Tighter padding on form groups */
    .fef-form-group {
        margin-bottom: 14px;
    }

    /* Repeater items: tighter */
    .fef-repeater-item {
        padding: 8px !important;
    }
    .fef-repeater-item-header {
        padding-bottom: 4px;
        margin-bottom: 6px;
    }
    .fef-repeater-item-title {
        font-size: 14px;
    }

    /* Working hours: compact */
    .fef-wh-row {
        padding: 10px !important;
    }
    .fef-wh-status-toggle {
        width: 100%;
        display: flex;
    }
    .fef-wh-status-btn {
        flex: 1;
        text-align: center;
    }

    /* Form labels: smaller */
    .fef-form-group label {
        font-size: 13px;
        margin-bottom: 4px;
    }

    /* Inputs: slightly less padding */
    .fef-form-control {
        padding: 10px 12px;
        font-size: 14px;
    }

    /* Buttons full width */
    .fef-repeater-add {
        font-size: 13px;
        padding: 10px;
    }
    .fef-wh-add-holiday {
        width: 100%;
        justify-content: center;
    }

    /* Holidays header stack */
    .fef-wh-holidays-header {
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }
}

/* ================================================================
 * STEP NAVIGATION - BUTTON POSITIONING
 * ================================================================*/
.fef-step-navigation {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: flex-end;
    align-items: center;
    margin-top: 20px;
    width: 100%;
}

/* First step - only Next button */
.fef-step-navigation[data-current-step="1"] {
    justify-content: var(--fef-first-align, flex-end);
}

/* Middle steps - Prev + Next */
.fef-step-navigation.has-prev:not(.is-last) {
    justify-content: var(--fef-middle-align, space-between);
}

/* Last step - Prev + Submit */
.fef-step-navigation.is-last {
    justify-content: var(--fef-last-align, space-between);
}

.fef-btn-prev, .fef-btn-next {
    padding: 12px 30px;
    background: var(--fef-bg, #fafafa);
    border: 1px solid var(--fef-border, #e0e0e0);
    border-radius: 8px;
    cursor: pointer;
    font-size: 15px;
    font-weight: 500;
    transition: all .2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 120px;
}

.fef-btn-prev {
    background: #fff;
    color: var(--fef-text, #333);
}

.fef-btn-prev:hover {
    background: var(--fef-bg, #f5f5f5);
    border-color: var(--fef-primary, #667eea);
}

.fef-btn-next {
    background: var(--fef-primary, #667eea);
    border-color: var(--fef-primary, #667eea);
    color: #fff;
}

.fef-btn-next:hover { 
    background: var(--fef-primary-dark, #5a6fd6);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(102,126,234,0.3);
}

/* Button Icons */
.fef-btn-icon {
    display: inline-flex;
    align-items: center;
}

/* BUTTONS & MESSAGES */
.fef-submit-btn {
    padding: 14px 30px;
    background: var(--fef-primary, #667eea);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all .3s;
    min-width: 150px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

/* When in navigation, don't stretch full width */
.fef-step-navigation .fef-submit-btn {
    width: auto;
}

/* Single form submit button - full width */
.fef-form-group > .fef-submit-btn:only-child {
    width: 100%;
}

.fef-submit-btn:hover {
    background: var(--fef-primary-dark, #5a6fd6);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(102,126,234,.4);
}

.fef-submit-btn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
    transform: none;
}

.fef-submit-btn.fef-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.fef-spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255,255,255,.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: fef-spin 1s linear infinite;
}

@keyframes fef-spin {
    to { transform: rotate(360deg); }
}

.fef-message {
    padding: 15px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 15px;
}
.fef-message.success {
    background: #e8f5e9;
    color: #2e7d32;
    border: 1px solid #a5d6a7;
}
.fef-message.error {
    background: #ffebee;
    color: #c62828;
    border: 1px solid #ef9a9a;
}

/* MEDIA UPLOAD */
.fef-media-upload { position: relative; }

.fef-media-dropzone {
    border: 2px dashed var(--fef-border);
    border-radius: 12px;
    padding: 40px 20px;
    text-align: center;
    cursor: pointer;
    transition: all .3s;
    background: var(--fef-bg);
}
.fef-media-dropzone:hover, .fef-media-dropzone.fef-drag-over {
    border-color: var(--fef-primary);
    background: rgba(102,126,234,.05);
}
.fef-media-dropzone.fef-drag-over {
    transform: scale(1.02);
    border-style: solid;
}
.fef-media-dropzone span {
    display: block;
    font-size: 16px;
    color: var(--fef-text-light);
}
.fef-media-dropzone input[type="file"] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

.fef-media-preview {
    position: relative;
    display: inline-block;
    margin-top: 10px;
}
.fef-media-preview img {
    max-width: 200px;
    max-height: 200px;
    border-radius: 8px;
    border: 1px solid var(--fef-border);
}
.fef-media-remove {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 26px;
    height: 26px;
    background: var(--fef-error);
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    cursor: pointer;
    font-size: 16px;
    font-weight: 400;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1;
    text-align: center;
    box-shadow: 0 2px 6px rgba(0,0,0,.2);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.fef-media-remove:hover {
    background: #d32f2f;
    transform: scale(1.1);
}

/* IMAGE CROPPER MODAL */
.fef-cropper-modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.92);
    z-index: 999999;
    align-items: center;
    justify-content: center;
    padding: 20px;
    box-sizing: border-box;
}

/* CRITICAL: Ensure modal displays as flex overlay when shown */
.fef-cropper-modal.fef-cropper-active {
    display: flex !important;
}

body.fef-cropper-open {
    overflow: hidden !important;
}

.fef-cropper-container {
    background: #fff;
    border-radius: 16px;
    max-width: 800px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 25px 80px rgba(0,0,0,0.5);
    overflow: hidden;
    position: relative;
}

.fef-cropper-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    border-bottom: 1px solid #eee;
    background: #fafafa;
    flex-shrink: 0;
}

.fef-cropper-header h4 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #333;
}

.fef-cropper-close {
    background: #f0f0f0;
    border: none;
    font-size: 18px;
    color: #666;
    cursor: pointer;
    padding: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s;
    line-height: 1;
    font-family: Arial, sans-serif;
    position: static;
}

.fef-cropper-close:hover {
    background: #d32f2f;
    color: #fff;
}

.fef-cropper-body {
    flex: 1;
    overflow: hidden;
    padding: 20px;
    background: #333;
    position: relative;
    min-height: 300px;
    max-height: 500px;
}

.fef-cropper-image-container {
    width: 100%;
    height: 400px;
    position: relative;
    overflow: hidden;
    background: #333; /* Solid background - no checkers */
}

/* CRITICAL: Hide the original image, only show cropper canvas */
.fef-cropper-image {
    display: block;
    max-width: 100%;
    opacity: 0; /* Hide original, cropper.js creates its own canvas */
}

.fef-cropper-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 24px;
    border-top: 1px solid #eee;
    background: #fafafa;
    flex-shrink: 0;
}

.fef-cropper-info {
    font-size: 13px;
    color: #888;
}

.fef-cropper-actions {
    display: flex;
    gap: 12px;
}

.fef-cropper-cancel {
    padding: 12px 24px;
    background: #fff;
    color: #666;
    border: 1px solid #ddd;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
}

.fef-cropper-cancel:hover {
    background: #f5f5f5;
    border-color: #ccc;
}

/* Cropper button base class */
.fef-cropper-btn {
    padding: 12px 24px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
    border: 1px solid #ddd;
}

/* Skip Crop Button */
.fef-cropper-skip {
    padding: 12px 24px;
    background: #f8f9fa;
    color: #666;
    border: 1px solid #ddd;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
}

.fef-cropper-skip:hover {
    background: #e9ecef;
    border-color: #adb5bd;
}

/* Confirm/Apply Button */
.fef-cropper-apply,
.fef-cropper-confirm {
    padding: 12px 30px;
    background: var(--fef-primary, #667eea);
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 600;
    transition: all 0.2s;
}

.fef-cropper-apply:hover,
.fef-cropper-confirm:hover {
    background: var(--fef-primary-dark, #5a6fd6);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

/* Cropper.js CRITICAL overrides */
.fef-cropper-image-container .cropper-container {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

.fef-cropper-image-container > img {
    max-width: 100%;
    max-height: 100%;
}

.cropper-container {
    direction: ltr;
    font-size: 0;
    line-height: 0;
    touch-action: none;
    user-select: none;
}

.cropper-wrap-box,
.cropper-canvas,
.cropper-drag-box,
.cropper-crop-box,
.cropper-modal {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.cropper-wrap-box {
    overflow: hidden;
}

.cropper-drag-box {
    background-color: #fff;
    opacity: 0;
}

.cropper-crop-box {
    border-radius: 0;
}

.cropper-view-box {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 100%;
    /* Thick solid black border — clearly visible on any background */
    outline: 3px solid #000;
    outline-offset: -3px;
    box-shadow:
        0 0 0 3px #000,           /* inner black ring */
        0 0 0 6px rgba(255,255,255,0.85), /* white gap for contrast */
        0 0 0 8px #000,           /* outer black ring */
        0 0 20px 8px rgba(0,0,0,0.7); /* heavy drop shadow */
}

.cropper-view-box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Hide the thin internal grid/rule lines — they clutter on white images */
.cropper-line {
    display: none;
}

/* Hide the dashed inner thirds guides */
.cropper-dashed {
    display: none;
}

/* Corner & edge handles — large, solid black squares with white outline */
.cropper-point {
    background-color: #000 !important;
    width: 16px !important;
    height: 16px !important;
    border-radius: 2px !important;
    border: 2px solid #fff !important;
    box-shadow: 0 0 0 1px #000, 0 2px 6px rgba(0,0,0,0.6) !important;
    opacity: 1 !important;
}

.cropper-point.point-e,
.cropper-point.point-w {
    margin-top: -8px !important;
    width: 16px !important;
    height: 16px !important;
}

.cropper-point.point-n,
.cropper-point.point-s {
    margin-left: -8px !important;
    width: 16px !important;
    height: 16px !important;
}

.cropper-point.point-se,
.cropper-point.point-sw,
.cropper-point.point-ne,
.cropper-point.point-nw {
    width: 18px !important;
    height: 18px !important;
}

.cropper-center {
    display: none;
}

.cropper-face {
    background-color: transparent;
}

/* Strong dark mask over the area OUTSIDE the crop box */
.cropper-modal {
    background-color: rgba(0, 0, 0, 0.75);
    backdrop-filter: blur(1px);
}

.cropper-bg {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC');
}

/* Simple cropper fallback */
.fef-simple-cropper {
    position: relative;
}

.fef-crop-box {
    position: absolute;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 80%;
    border: 2px dashed var(--fef-primary, #667eea);
    background: rgba(102,126,234,0.1);
    cursor: move;
}

.fef-crop-handle {
    position: absolute;
    width: 14px;
    height: 14px;
    background: var(--fef-primary, #667eea);
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.fef-crop-nw { top: -7px; left: -7px; cursor: nw-resize; }
.fef-crop-ne { top: -7px; right: -7px; cursor: ne-resize; }
.fef-crop-sw { bottom: -7px; left: -7px; cursor: sw-resize; }
.fef-crop-se { bottom: -7px; right: -7px; cursor: se-resize; }

/* Responsive cropper */
@media (max-width: 768px) {
    .fef-cropper-container {
        max-height: 95vh;
        margin: 10px;
        border-radius: 12px;
    }
    
    .fef-cropper-header,
    .fef-cropper-footer {
        padding: 14px 18px;
    }
    
    .fef-cropper-body {
        min-height: 250px;
        max-height: 400px;
    }
    
    .fef-cropper-image-container {
        height: 300px;
    }
    
    .fef-cropper-footer {
        flex-direction: column;
        gap: 12px;
    }
    
    .fef-cropper-info {
        text-align: center;
        order: 2;
    }
    
    .fef-cropper-actions {
        width: 100%;
        order: 1;
    }
    
    .fef-cropper-cancel,
    .fef-cropper-apply {
        flex: 1;
        text-align: center;
    }
}

/* GALLERY UPLOAD */
.fef-gallery-upload { position: relative; }

.fef-gallery-dropzone {
    border: 2px dashed var(--fef-border);
    border-radius: 12px;
    padding: 40px 20px;
    text-align: center;
    cursor: pointer;
    transition: all .3s;
    background: var(--fef-bg);
    position: relative;
}
.fef-gallery-dropzone:hover, .fef-gallery-dropzone.fef-drag-over {
    border-color: var(--fef-primary);
    background: rgba(102,126,234,.05);
}
.fef-gallery-dropzone.fef-drag-over {
    transform: scale(1.02);
    border-style: solid;
}
.fef-gallery-dropzone span {
    display: block;
    font-size: 16px;
    color: var(--fef-text-light);
}
.fef-gallery-dropzone input[type="file"] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

.fef-gallery-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 15px;
    padding: 8px 8px 0 0;
}
.fef-gallery-item {
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,.1);
}
.fef-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.fef-gallery-remove {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 22px;
    height: 22px;
    background: #1f2937;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    cursor: pointer;
    font-size: 12px;
    font-weight: 400;
    line-height: 1;
    transition: all .2s;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    box-shadow: 0 2px 6px rgba(0,0,0,.2);
    z-index: 2;
}
.fef-gallery-remove:hover { 
    background: #dc2626; 
    transform: scale(1.1);
}

.fef-file-info {
    font-size: 12px;
    color: var(--fef-text-light);
    margin-top: 8px;
}
.fef-gallery-count {
    font-weight: 600;
    color: var(--fef-primary);
}

/* DUPLICATE CHECK STATUS */
.fef-dup-status {
    font-size: 13px;
    margin-top: 6px;
    min-height: 20px;
    transition: all .2s;
}
.fef-dup-status.checking { color: var(--fef-text-light); }
.fef-dup-status.exists { color: var(--fef-error); font-weight: 600; }
.fef-dup-status.available { color: var(--fef-success); font-weight: 500; }

.fef-spinner-sm {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid var(--fef-border);
    border-top-color: var(--fef-primary);
    border-radius: 50%;
    animation: fef-spin 1s linear infinite;
    vertical-align: middle;
    margin-right: 6px;
}

/* WORD/CHARACTER LIMIT */
.fef-limit-counter {
    display: block;
    font-size: 12px;
    color: var(--fef-text-light);
    margin-top: 6px;
    text-align: right;
}
.fef-limit-counter.fef-limit-warning { color: var(--fef-warning); }
.fef-limit-counter.fef-limit-exceeded { 
    color: var(--fef-error); 
    font-weight: 600;
}

/* SUCCESS METERS */
.fef-quality-meter {
    margin-top: 15px;
    background: #f8f9fa;
    border-radius: 12px;
    padding: 15px;
    border: 1px solid var(--fef-border);
}

.fef-qm-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.fef-qm-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--fef-text);
}

.fef-qm-score {
    font-size: 14px;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 20px;
    background: var(--fef-bg);
}

.fef-qm-score.poor { background: #ffebee; color: #c62828; }
.fef-qm-score.basic { background: #fff3e0; color: #ef6c00; }
.fef-qm-score.good { background: #e8f5e9; color: #2e7d32; }
.fef-qm-score.great { background: #e3f2fd; color: #1565c0; }

/* Main Progress Bar */
.fef-qm-progress {
    height: 8px;
    background: #e0e0e0;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 15px;
}

.fef-qm-bar {
    height: 100%;
    border-radius: 4px;
    transition: width 0.4s ease, background 0.3s;
    background: linear-gradient(90deg, #ef5350, #ff9800, #66bb6a, #42a5f5);
    background-size: 400% 100%;
}

.fef-qm-bar.level-0 { width: 0%; background-position: 0% 0; }
.fef-qm-bar.level-1 { width: 25%; background-position: 0% 0; }
.fef-qm-bar.level-2 { width: 50%; background-position: 33% 0; }
.fef-qm-bar.level-3 { width: 75%; background-position: 66% 0; }
.fef-qm-bar.level-4 { width: 100%; background-position: 100% 0; }

/* Checklist Items */
.fef-qm-checklist {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

@media (max-width: 480px) {
    .fef-qm-checklist { grid-template-columns: 1fr; }
}

.fef-qm-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--fef-text-light);
    padding: 6px 10px;
    background: #fff;
    border-radius: 6px;
    transition: all 0.3s;
}

.fef-qm-item.completed {
    color: #2e7d32;
    background: #e8f5e9;
}

.fef-qm-icon {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    flex-shrink: 0;
    transition: all 0.3s;
}

.fef-qm-item .fef-qm-icon {
    background: #e0e0e0;
    color: #9e9e9e;
}

.fef-qm-item.completed .fef-qm-icon {
    background: #66bb6a;
    color: #fff;
}

.fef-qm-item.completed .fef-qm-icon::after {
    content: "✓";
}

.fef-qm-item:not(.completed) .fef-qm-icon::after {
    content: "○";
}

/* Tips Section */
.fef-qm-tips, .fef-sm-tips, .fef-stm-tips, .fef-rm-tips, .fef-tm-tips {
    margin-top: 10px;
    font-size: 13px;
}

.fef-tips-toggle {
    color: var(--fef-primary);
    text-decoration: none;
    font-size: 12px;
}

.fef-tips-toggle:hover {
    text-decoration: underline;
}

.fef-tips-content {
    background: #f8f9fa;
    border-radius: 6px;
    padding: 10px 15px;
    margin-top: 8px;
}

.fef-tips-list {
    margin: 0;
    padding-left: 18px;
    font-size: 12px;
    color: #666;
}

.fef-tips-list li {
    margin: 4px 0;
}

/* Circular Gauge Meter */
.fef-circular-meter {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    padding: 15px;
    background: #f8f9fa;
    border-radius: 10px;
}

.fef-cm-circle {
    position: relative;
    width: 80px;
    height: 80px;
    flex-shrink: 0;
}

.fef-cm-circle svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.fef-cm-bg {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 6;
}

.fef-cm-progress {
    fill: none;
    stroke: #e0e0e0;
    stroke-width: 6;
    stroke-linecap: round;
    stroke-dasharray: 188.5;
    stroke-dashoffset: 188.5;
    transition: all 0.5s ease;
}

.fef-cm-progress.level-1 { stroke: #ef5350; stroke-dashoffset: 141; }
.fef-cm-progress.level-2 { stroke: #ffa726; stroke-dashoffset: 94; }
.fef-cm-progress.level-3 { stroke: #66bb6a; stroke-dashoffset: 47; }
.fef-cm-progress.level-4 { stroke: #42a5f5; stroke-dashoffset: 0; }

.fef-cm-value {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 16px;
    font-weight: 700;
    color: var(--fef-text);
}

.fef-cm-info {
    flex: 1;
}

.fef-cm-label {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 10px;
    color: var(--fef-text);
}

.fef-cm-tips {
    font-size: 12px;
}

.fef-cm-tip {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 4px 0;
    color: #666;
}

.fef-cm-tip.done {
    color: #66bb6a;
}

.fef-cm-tip-icon {
    font-size: 11px;
}

/* Strength Bars Meter */
.fef-segments-meter {
    padding: 12px;
    background: #f8f9fa;
    border-radius: 8px;
}

.fef-sm-bars {
    display: flex;
    gap: 4px;
    margin-bottom: 8px;
}

.fef-sm-bar {
    flex: 1;
    height: 6px;
    background: #e0e0e0;
    border-radius: 3px;
    transition: all 0.3s;
}

.fef-sm-bar.active:nth-child(1) { background: #ef5350; }
.fef-sm-bar.active:nth-child(2) { background: #ffa726; }
.fef-sm-bar.active:nth-child(3) { background: #66bb6a; }
.fef-sm-bar.active:nth-child(4) { background: #42a5f5; }

.fef-sm-label {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fef-sm-text {
    font-weight: 600;
    font-size: 13px;
}

.fef-sm-text.level-1 { color: #ef5350; }
.fef-sm-text.level-2 { color: #ffa726; }
.fef-sm-text.level-3 { color: #66bb6a; }
.fef-sm-text.level-4 { color: #42a5f5; }

.fef-sm-hint {
    font-size: 11px;
    color: #999;
}

/* Checklist Steps Meter */
.fef-steps-meter {
    padding: 15px;
    background: #f8f9fa;
    border-radius: 10px;
}

.fef-stm-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.fef-stm-title {
    font-weight: 600;
    font-size: 14px;
    color: var(--fef-text);
}

.fef-stm-score {
    background: var(--fef-primary);
    color: #fff;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
}

.fef-stm-steps {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fef-stm-step {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: #fff;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    transition: all 0.3s;
}

.fef-stm-step.completed {
    background: #e8f5e9;
    border-color: #66bb6a;
}

.fef-stm-check {
    font-size: 16px;
    color: #999;
}

.fef-stm-step.completed .fef-stm-check {
    color: #66bb6a;
}

.fef-stm-label {
    font-size: 13px;
    color: #666;
}

.fef-stm-step.completed .fef-stm-label {
    color: #2e7d32;
}

/* Animated Ring Meter (Dark Theme) */
.fef-ring-meter {
    padding: 20px;
    background: linear-gradient(135deg, #1a1a2e, #16213e);
    border-radius: 12px;
    text-align: center;
}

.fef-rm-ring {
    position: relative;
    width: 120px;
    height: 120px;
    margin: 0 auto 15px;
}

.fef-rm-ring svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

.fef-rm-bg {
    fill: none;
    stroke: rgba(255,255,255,0.1);
    stroke-width: 8;
}

.fef-rm-progress {
    fill: none;
    stroke: #444;
    stroke-width: 8;
    stroke-linecap: round;
    stroke-dasharray: 283;
    stroke-dashoffset: 283;
    transition: all 0.6s ease;
}

.fef-rm-progress.level-1 { stroke: #ef5350; }
.fef-rm-progress.level-2 { stroke: #ffa726; }
.fef-rm-progress.level-3 { stroke: #66bb6a; }
.fef-rm-progress.level-4 { stroke: #42a5f5; }

.fef-rm-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}

.fef-rm-percent {
    display: block;
    font-size: 24px;
    font-weight: 700;
    color: #fff;
}

.fef-rm-label {
    display: block;
    font-size: 11px;
    color: rgba(255,255,255,0.6);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.fef-ring-meter .fef-tips-toggle {
    color: rgba(255,255,255,0.7);
}

.fef-ring-meter .fef-tips-content {
    background: rgba(255,255,255,0.1);
}

.fef-ring-meter .fef-tips-list {
    color: rgba(255,255,255,0.8);
}

/* Thermometer Meter */
.fef-thermo-meter {
    display: flex;
    align-items: stretch;
    gap: 15px;
    padding: 15px;
    background: #f8f9fa;
    border-radius: 10px;
}

.fef-tm-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 30px;
}

.fef-tm-track {
    width: 14px;
    height: 100px;
    background: #e0e0e0;
    border-radius: 7px 7px 0 0;
    position: relative;
    overflow: hidden;
}

.fef-tm-fill {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0%;
    border-radius: 7px 7px 0 0;
    transition: all 0.5s ease;
}

.fef-tm-fill.level-1 { background: #42a5f5; }
.fef-tm-fill.level-2 { background: #66bb6a; }
.fef-tm-fill.level-3 { background: #ffa726; }
.fef-tm-fill.level-4 { background: #ef5350; }

.fef-tm-bulb {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #e0e0e0;
    margin-top: -4px;
    transition: all 0.3s;
}

.fef-tm-bulb.level-1 { background: #42a5f5; }
.fef-tm-bulb.level-2 { background: #66bb6a; }
.fef-tm-bulb.level-3 { background: #ffa726; }
.fef-tm-bulb.level-4 { background: #ef5350; }

.fef-tm-labels {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100px;
    font-size: 12px;
}

.fef-tm-label {
    color: #999;
    transition: all 0.3s;
}

.fef-tm-label.active {
    color: var(--fef-text);
    font-weight: 600;
}

.fef-tm-status {
    flex: 1;
    display: flex;
    align-items: center;
    font-weight: 600;
    font-size: 14px;
    color: var(--fef-text);
}

/* OTHER COMPONENTS */
.fef-checkbox-item, .fef-radio-item { margin: 8px 0; }
.fef-checkbox-item label, .fef-radio-item label {
    display: flex;
    align-items: center;
    font-weight: normal;
    cursor: pointer;
    margin: 0;
}
.fef-checkbox-item input, .fef-radio-item input {
    margin-right: 10px;
    width: 18px;
    height: 18px;
}

.fef-range-wrap { display: flex; align-items: center; gap: 15px; }
.fef-range-slider {
    flex: 1;
    -webkit-appearance: none;
    height: 8px;
    background: var(--fef-border);
    border-radius: 4px;
}
.fef-range-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    background: var(--fef-primary);
    border-radius: 50%;
    cursor: pointer;
}
.fef-range-value {
    font-weight: 600;
    color: var(--fef-primary);
    min-width: 40px;
    text-align: center;
}

.fef-heading {
    text-align: left;
    font-size: 18px;
    font-weight: 400;
    color: #ff5900;
    padding: 8px;
    margin: 26px 0 16px;
    border: none;
    background-color: #ffefde;
    border-radius: 4px;
}

/* ================================================================
 * HEADING FIELD — STYLED VARIANT
 * ================================================================*/
.fef-heading-styled {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    position: relative;
    gap: 0;
}

/* Left accent border — CSS vars set inline by PHP render */
.fef-heading-accent {
    border-left: var(--fef-hd-accent-w, 4px) solid var(--fef-hd-accent-color, #667eea) !important;
    padding-left: 14px !important;
}

/* Icon wrapper */
.fef-hd-icon {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    line-height: 1;
}
.fef-hd-icon i,
.fef-hd-icon svg { display: block; }

/* Heading text */
.fef-hd-text { flex: 1; min-width: 0; }

/* Prefix badge — base */
.fef-hd-prefix {
    flex-shrink: 0;
    line-height: 1;
}
.fef-hd-prefix-circle {
    width: 1.8em;
    height: 1.8em;
    border-radius: 50%;
    font-size: 0.75em;
}
.fef-hd-prefix-square {
    width: 1.8em;
    height: 1.8em;
    border-radius: 4px;
    font-size: 0.75em;
}
.fef-hd-prefix-pill {
    min-width: 2em;
    height: 1.5em;
    border-radius: 100px;
    padding: 0 0.5em;
    font-size: 0.75em;
}


.fef-divider { border: none; border-top: 1px solid var(--fef-border); margin: 25px 0; }

.fef-switcher { position: relative; display: inline-block; width: 50px; height: 26px; }
.fef-switcher input { opacity: 0; width: 0; height: 0; }
.fef-switcher-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: #ccc;
    transition: .3s;
    border-radius: 26px;
}
.fef-switcher-slider::before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 3px;
    bottom: 3px;
    background-color: #fff;
    transition: .3s;
    border-radius: 50%;
}
.fef-switcher input:checked + .fef-switcher-slider { background-color: var(--fef-primary); }
.fef-switcher input:checked + .fef-switcher-slider::before { transform: translateX(24px); }

/* ================================================================
 * CONDITIONAL FIELD GROUPS
 * ================================================================*/
.fef-field-group {
    width: 100%;
    margin: 15px 0;
    padding: 20px;
    background: linear-gradient(135deg, #f8f9ff 0%, #f0f4ff 100%);
    border: 1px solid #e0e7ff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.08);
}

.fef-group-header {
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #e0e7ff;
}

.fef-group-title {
    margin: 0 0 8px 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--fef-primary, #667eea);
    display: flex;
    align-items: center;
    gap: 8px;
}

.fef-group-title::before {
    content: "📁";
    font-size: 16px;
}

.fef-group-description {
    margin: 0;
    font-size: 14px;
    color: var(--fef-text-light, #666);
}

.fef-group-fields {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin: 0 -10px;
}

.fef-group-fields .fef-form-group {
    padding: 0 10px;
    box-sizing: border-box;
}

/* Group Trigger Dropdown */
.fef-group-trigger {
    border: 2px solid var(--fef-primary, #667eea) !important;
    background-color: #fff;
    font-weight: 500;
}

.fef-group-trigger:focus {
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.2);
}

/* Nested conditionals inside groups */
.fef-field-group .fef-conditional-block {
    width: 100%;
    margin: 0;
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

/* Animation for groups */
.fef-field-group {
    animation: fefGroupFadeIn 0.3s ease-out;
}

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

/* Responsive groups */
@media (max-width: 768px) {
    .fef-field-group {
        padding: 15px;
    }
    
    .fef-group-fields .fef-form-group {
        width: 100% !important;
    }
}

/* ================================================================
 * FIELD DESCRIPTION
 * ================================================================*/
.fef-field-description {
    font-size: 12px;
    color: var(--fef-text-light, #666);
    margin-top: 6px;
    line-height: 1.4;
    font-style: italic;
}

/* ================================================================
 * AMOUNT FIELD (Currency)
 * ================================================================*/
.fef-amount-wrapper {
    display: flex;
    align-items: center;
    position: relative;
}

.fef-amount-symbol {
    font-size: 16px;
    font-weight: 600;
    color: var(--fef-text, #333);
    background: var(--fef-bg, #fafafa);
    padding: 12px 14px;
    border: 1px solid var(--fef-border, #e0e0e0);
    line-height: 1;
}

.fef-symbol-before {
    border-radius: 8px 0 0 8px;
    border-right: none;
}

.fef-symbol-after {
    border-radius: 0 8px 8px 0;
    border-left: none;
}

.fef-amount-wrapper .fef-amount-input {
    flex: 1;
    border-radius: 0 8px 8px 0;
    font-family: 'Courier New', monospace;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.5px;
}

.fef-amount-wrapper[data-position="after"] .fef-amount-input {
    border-radius: 8px 0 0 8px;
}

.fef-amount-wrapper[data-position="before"] .fef-symbol-before + .fef-amount-input {
    border-radius: 0 8px 8px 0;
}

.fef-amount-input.fef-error {
    border-color: var(--fef-error, #d32f2f) !important;
    background-color: #fff5f5;
}

/* ================================================================
 * TEXT TITLE
 * ================================================================*/
.fef-text-title {
    margin: 0;
    padding: 10px 0;
    color: var(--fef-text, #333);
}

/* ================================================================
 * PARAGRAPH
 * ================================================================*/
.fef-paragraph {
    padding: 10px 0;
    color: var(--fef-text, #333);
    line-height: 1.6;
}

.fef-paragraph p {
    margin: 0 0 10px;
}

.fef-paragraph p:last-child {
    margin-bottom: 0;
}

/* ================================================================
 * ALERT MESSAGE
 * ================================================================*/
.fef-alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 18px;
    border-radius: 10px;
    margin: 10px 0;
    position: relative;
}

.fef-alert-icon {
    font-size: 18px;
    line-height: 1;
    flex-shrink: 0;
}

.fef-alert-content {
    flex: 1;
    font-size: 14px;
    line-height: 1.5;
}

.fef-alert-dismiss {
    background: none;
    border: none;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

.fef-alert-dismiss:hover {
    opacity: 1;
}

/* Alert Types */
.fef-alert-info {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
    border: 1px solid #90caf9;
    color: #1565c0;
}

.fef-alert-info .fef-alert-dismiss { color: #1565c0; }

.fef-alert-success {
    background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
    border: 1px solid #a5d6a7;
    color: #2e7d32;
}

.fef-alert-success .fef-alert-dismiss { color: #2e7d32; }

.fef-alert-warning {
    background: linear-gradient(135deg, #fff3e0 0%, #ffe0b2 100%);
    border: 1px solid #ffcc80;
    color: #e65100;
}

.fef-alert-warning .fef-alert-dismiss { color: #e65100; }

.fef-alert-error {
    background: linear-gradient(135deg, #ffebee 0%, #ffcdd2 100%);
    border: 1px solid #ef9a9a;
    color: #c62828;
}

.fef-alert-error .fef-alert-dismiss { color: #c62828; }

.fef-alert-neutral {
    background: linear-gradient(135deg, #f5f5f5 0%, #e0e0e0 100%);
    border: 1px solid #bdbdbd;
    color: #424242;
}

.fef-alert-neutral .fef-alert-dismiss { color: #424242; }

/* ================================================================
 * DISPLAY IMAGE
 * ================================================================*/
.fef-display-image {
    padding: 10px 0;
}

.fef-display-image img {
    display: inline-block;
    max-width: 100%;
    height: auto;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.fef-display-image a {
    display: inline-block;
    transition: transform 0.2s;
}

.fef-display-image a:hover {
    transform: scale(1.02);
}

/* ================================================================
 * PRODUCT LIST (Order Form)
 * ================================================================*/
.fef-product-list {
    width: 100%;
    overflow-x: auto;
}

.fef-product-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

.fef-product-table thead {
    background: linear-gradient(135deg, var(--fef-primary, #667eea) 0%, var(--fef-primary-dark, #5a6fd6) 100%);
    color: #fff;
}

.fef-product-table th {
    padding: 14px 12px;
    text-align: left;
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.fef-product-table td {
    padding: 14px 12px;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

.fef-product-table tbody tr:hover {
    background: #fafafa;
}

.fef-product-table tbody tr:last-child td {
    border-bottom: none;
}

.fef-pl-sr {
    width: 40px;
    text-align: center;
    color: #999;
    font-weight: 500;
}

.fef-pl-name {
    min-width: 200px;
}

.fef-prod-title {
    display: block;
    font-weight: 600;
    color: var(--fef-text, #333);
    margin-bottom: 2px;
}

.fef-prod-desc {
    display: block;
    font-size: 12px;
    color: var(--fef-text-light, #666);
    line-height: 1.4;
}

.fef-pl-price {
    white-space: nowrap;
    font-family: 'Courier New', monospace;
    color: var(--fef-text, #333);
}

.fef-pl-qty {
    width: 130px;
}

.fef-qty-control {
    display: flex;
    align-items: center;
    gap: 0;
    background: #f5f5f5;
    border-radius: 8px;
    overflow: hidden;
}

.fef-qty-btn {
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    color: var(--fef-text, #333);
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fef-qty-btn:hover {
    background: var(--fef-primary, #667eea);
    color: #fff;
}

.fef-qty-input {
    width: 50px !important;
    text-align: center;
    border: none !important;
    background: transparent !important;
    font-size: 15px;
    font-weight: 600;
    padding: 8px 0 !important;
    -moz-appearance: textfield;
}

.fef-qty-input::-webkit-outer-spin-button,
.fef-qty-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.fef-pl-total {
    white-space: nowrap;
    font-family: 'Courier New', monospace;
    font-weight: 600;
    color: var(--fef-primary, #667eea);
    min-width: 100px;
}

.fef-grand-total-row {
    background: linear-gradient(135deg, #f8f9ff 0%, #f0f4ff 100%);
}

.fef-grand-total-row td {
    border-bottom: none !important;
    padding: 16px 12px;
}

.fef-gt-label {
    text-align: right;
    font-weight: 700;
    font-size: 15px;
    color: var(--fef-text, #333);
}

.fef-gt-value {
    font-family: 'Courier New', monospace;
    font-weight: 700;
    font-size: 18px;
    color: var(--fef-primary, #667eea);
}

/* ================================================================
 * DYNAMIC LIST (User Input Rows)
 * ================================================================*/
.fef-dynamic-list {
    width: 100%;
}

.fef-dynamic-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    margin-bottom: 12px;
}

.fef-dynamic-table thead {
    background: #f8f9fa;
}

.fef-dynamic-table th {
    padding: 12px 10px;
    text-align: left;
    font-weight: 600;
    font-size: 12px;
    color: var(--fef-text-light, #666);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 2px solid #e9ecef;
}

.fef-dynamic-table td {
    padding: 10px;
    border-bottom: 1px solid #f0f0f0;
    vertical-align: middle;
}

.fef-dynamic-table tbody tr:last-child td {
    border-bottom: none;
}

.fef-dl-sr {
    width: 40px;
    text-align: center;
}

.fef-row-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    background: var(--fef-bg, #fafafa);
    border-radius: 50%;
    font-size: 12px;
    font-weight: 600;
    color: var(--fef-text-light, #666);
}

.fef-dl-input {
    padding: 10px 12px !important;
    font-size: 14px !important;
}

.fef-dl-actions {
    width: 40px;
    text-align: center;
}

.fef-dl-remove {
    width: 28px;
    height: 28px;
    border: none;
    background: #fff;
    color: #999;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    transition: all 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.fef-dl-remove:hover:not(.fef-disabled) {
    background: var(--fef-error, #d32f2f);
    color: #fff;
}

.fef-dl-remove.fef-disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.fef-dl-add {
    width: 100%;
    padding: 12px 20px;
    background: linear-gradient(135deg, #f8f9ff 0%, #f0f4ff 100%);
    border: 2px dashed var(--fef-primary, #667eea);
    border-radius: 10px;
    color: var(--fef-primary, #667eea);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
}

.fef-dl-add:hover:not(.fef-disabled) {
    background: var(--fef-primary, #667eea);
    border-color: var(--fef-primary, #667eea);
    color: #fff;
}

.fef-dl-add.fef-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Row animations */
.fef-dynamic-row {
    transition: background 0.2s, opacity 0.2s;
}

.fef-row-new {
    animation: fefRowFadeIn 0.3s ease-out;
}

.fef-row-removing {
    opacity: 0.5;
    background: #ffebee;
}

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

/* Responsive */
@media (max-width: 768px) {
    .fef-product-table th,
    .fef-product-table td {
        padding: 10px 8px;
    }
    
    .fef-pl-name {
        min-width: 140px;
    }
    
    .fef-qty-btn {
        width: 32px;
        height: 32px;
    }
    
    .fef-qty-input {
        width: 40px !important;
    }
}

/* REPEATER */
.fef-repeater-row {
    display: flex;
    gap: 8px;
    align-items: flex-end;
    padding: 10px;
    background: var(--fef-bg);
    border-radius: 6px;
    margin-bottom: 6px;
}
.fef-repeater-field { flex: 1; }
.fef-repeater-field label { font-size: 12px; margin-bottom: 3px; }
.fef-repeater-remove {
    width: 28px;
    height: 28px;
    min-width: 28px;
    background: #1f2937;
    border: none;
    color: #fff;
    border-radius: 50%;
    cursor: pointer;
    font-size: 13px;
    font-weight: 400;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: all 0.2s;
}
.fef-repeater-remove:hover {
    background: #dc2626;
    color: #fff;
}
.fef-repeater-add {
    padding: 7px 14px;
    background: #fff;
    border: 1px dashed #d1d5db;
    border-radius: 6px;
    cursor: pointer;
    width: 100%;
    font-size: 12px;
    color: #6b7280;
}
.fef-repeater-add:hover { border-color: #9ca3af; color: #374151; }

.fef-calculated {
    padding: 15px;
    background: var(--fef-bg);
    border-radius: 8px;
    font-size: 18px;
    text-align: center;
}
.fef-calc-result { font-weight: 700; color: var(--fef-primary); }

.fef-recaptcha-badge {
    font-size: 12px;
    color: var(--fef-text-light);
    text-align: center;
    padding: 10px;
    background: var(--fef-bg);
    border-radius: 6px;
}

.fef-taxonomy-select select { margin-bottom: 10px; }
.fef-taxonomy-select select.fef-loading { opacity: 0.6; }

/* ANIMATIONS */
@keyframes fef-complete-pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.2); }
    100% { transform: scale(1); }
}

.fef-qm-item.just-completed .fef-qm-icon {
    animation: fef-complete-pulse 0.4s ease;
}


.fef-accordion-container {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
}

.fef-accordion-panel {
    background: #fff;
    border: 2px solid var(--fef-border, #e0e0e0);
    border-radius: 12px;
    margin-bottom: 16px;
    overflow: hidden;
    transition: all 0.3s ease;
    width: 100%;
    max-width: 100%;
}

.fef-accordion-panel.active {
    border-color: var(--fef-primary, #667eea);
    box-shadow: 0 4px 16px rgba(102,126,234,0.15);
}

.fef-accordion-panel.completed {
    border-color: var(--fef-success, #388e3c);
    background: linear-gradient(to right, #f1f8f4 0%, #ffffff 100%);
}

.fef-accordion-panel.locked {
    opacity: 0.6;
    pointer-events: none;
    cursor: not-allowed;
}

.fef-accordion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    cursor: pointer;
    background: linear-gradient(to right, #fafafa 0%, #ffffff 100%);
    border-bottom: 1px solid transparent;
    transition: all 0.3s ease;
    user-select: none;
}

.fef-accordion-panel.active .fef-accordion-header {
    background: linear-gradient(to right, rgba(102,126,234,0.05) 0%, #ffffff 100%);
    border-bottom-color: var(--fef-border, #e0e0e0);
}

.fef-accordion-panel.completed .fef-accordion-header {
    background: linear-gradient(to right, rgba(56,142,60,0.08) 0%, #ffffff 100%);
}

.fef-accordion-panel:not(.locked) .fef-accordion-header:hover {
    background: linear-gradient(to right, rgba(102,126,234,0.03) 0%, #ffffff 100%);
}

.fef-accordion-title {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
}

.fef-accordion-number {
    width: 40px;
    height: 40px;
    background: var(--fef-bg, #fafafa);
    border: 2px solid var(--fef-border, #e0e0e0);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
    color: var(--fef-text-light, #666);
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.fef-accordion-panel.active .fef-accordion-number {
    background: var(--fef-primary, #667eea);
    border-color: var(--fef-primary, #667eea);
    color: #fff;
    transform: scale(1.05);
}

.fef-accordion-panel.completed .fef-accordion-number {
    background: var(--fef-success, #388e3c);
    border-color: var(--fef-success, #388e3c);
    color: #fff;
}

.fef-accordion-label {
    font-size: 18px;
    font-weight: 600;
    color: var(--fef-text, #333);
}

.fef-accordion-panel.locked .fef-accordion-label {
    color: var(--fef-text-light, #666);
}

.fef-accordion-status {
    margin-left: auto;
    font-size: 24px;
    color: var(--fef-success, #388e3c);
    font-weight: 700;
    min-width: 30px;
    text-align: center;
}

.fef-accordion-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.fef-accordion-edit {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #fff;
    border: 1px solid var(--fef-primary, #667eea);
    color: var(--fef-primary, #667eea);
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}

.fef-accordion-edit:hover {
    background: var(--fef-primary, #667eea);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(102,126,234,0.3);
}

.fef-accordion-edit svg {
    width: 16px;
    height: 16px;
}

.fef-accordion-toggle {
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    color: var(--fef-text-light, #666);
    cursor: pointer;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    padding: 0;
}

.fef-accordion-toggle:hover {
    background: rgba(0,0,0,0.05);
}

.fef-accordion-icon {
    transition: transform 0.3s ease;
    display: block;
}

.fef-accordion-panel.active .fef-accordion-icon {
    transform: rotate(180deg);
}

.fef-accordion-content {
    border-top: 1px solid var(--fef-border, #e0e0e0);
    overflow: hidden;
}

.fef-accordion-body {
    padding: 30px 24px;
}

.fef-accordion-footer {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--fef-border, #e0e0e0);
    text-align: right;
}

.fef-accordion-next {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 32px;
    background: var(--fef-primary, #667eea);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.fef-accordion-next:hover {
    background: var(--fef-primary-dark, #5a6fd6);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102,126,234,0.4);
}

.fef-accordion-next svg {
    width: 16px;
    height: 16px;
    transition: transform 0.2s ease;
}

.fef-accordion-next:hover svg {
    transform: translateX(4px);
}

.fef-accordion-submit {
    width: auto;
    min-width: 200px;
}

/* Accordion mode wrapper */
.fef-accordion-mode {
    padding: 20px;
}

/* Hide default multi-step navigation in accordion mode */
.fef-accordion-form .fef-step-navigation {
    display: none;
}

.fef-accordion-form .fef-form-group {
    padding-right: 0;
}

/* Mobile responsive */
@media (max-width: 768px) {
    .fef-accordion-header {
        padding: 16px;
    }
    
    .fef-accordion-title {
        gap: 12px;
    }
    
    .fef-accordion-number {
        width: 36px;
        height: 36px;
        font-size: 16px;
    }
    
    .fef-accordion-label {
        font-size: 16px;
    }
    
    .fef-accordion-edit {
        padding: 6px 12px;
        font-size: 13px;
    }
    
    .fef-accordion-edit span:not(.fef-accordion-edit svg) {
        display: none; /* Hide "Edit" text on mobile, show only icon */
    }
    
    .fef-accordion-body {
        padding: 20px 16px;
    }
    
    .fef-accordion-footer {
        margin-top: 20px;
        padding-top: 15px;
    }
    
    .fef-accordion-next {
        width: 100%;
        justify-content: center;
    }
}

/* Animation for status checkmark */
@keyframes fef-checkmark-appear {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.fef-accordion-panel.completed .fef-accordion-status {
    animation: fef-checkmark-appear 0.4s ease;
}

/* Pulse animation for active accordion number */
@keyframes fef-pulse-number {
    0% {
        box-shadow: 0 0 0 0 rgba(102,126,234,0.4);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(102,126,234,0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(102,126,234,0);
    }
}

.fef-accordion-panel.active .fef-accordion-number {
    animation: fef-pulse-number 2s infinite;
}

/* Loading state for form submission */
.fef-accordion-submit.fef-loading {
    pointer-events: none;
    opacity: 0.7;
}

/* Smooth slide animation */
.fef-accordion-content {
    transition: all 0.3s ease-in-out;
}

/* ================================================================
 * ACCORDION WIDTH & BORDER FIXES
 * ================================================================*/

/* Remove default blue border from all form elements */
.fef-registration-form,
.fef-form-wrapper,
.fef-accordion-form,
.fef-accordion-container,
.fef-accordion-panel {
    border-color: var(--fef-border, #e0e0e0);
}

/* Full width accordion fix */
.fef-accordion-form {
    width: 100% !important;
    max-width: 100% !important;
}

.fef-registration-form.fef-accordion-mode {
    width: 100% !important;
    max-width: 100% !important;
}

.fef-registration-form.fef-accordion-mode .fef-form-container {
    display: block;
    width: 100%;
}

.fef-registration-form.fef-accordion-mode .fef-form-wrapper {
    width: 100%;
    max-width: 100%;
}

/* Fix accordion width when preview is hidden */
.fef-registration-form.preview-hidden .fef-accordion-container,
.fef-registration-form.preview-hidden .fef-form-wrapper {
    width: 100% !important;
    max-width: 100% !important;
}

/* ================================================================
 * STICKY BUTTON SUPPORT FOR ACCORDION - COMPREHENSIVE FIX
 * ================================================================*/

/* Flow style for accordion (default) */
.fef-accordion-container.fef-buttons-flow .fef-accordion-footer,
.fef-accordion-form.fef-buttons-flow .fef-accordion-footer {
    display: flex;
    justify-content: flex-end;
    padding: 20px;
    border-top: 1px solid var(--fef-border, #e0e0e0);
}

/* ================================================================
 * STICKY (Floating Bottom Bar) - This is what user wants working
 * ================================================================*/
.fef-accordion-container.fef-buttons-sticky,
.fef-accordion-form.fef-buttons-sticky {
    position: relative;
}

.fef-accordion-container.fef-buttons-sticky .fef-accordion-footer,
.fef-accordion-form.fef-buttons-sticky .fef-accordion-footer,
.fef-buttons-sticky .fef-accordion-footer {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: linear-gradient(to top, rgba(255,255,255,0.98) 80%, rgba(255,255,255,0.9) 100%) !important;
    padding: 15px 30px !important;
    margin: 0 !important;
    z-index: 99999 !important;
    border-top: 1px solid rgba(0,0,0,0.1) !important;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.1) !important;
    display: flex !important;
    justify-content: center !important;
    gap: 15px !important;
}

.fef-buttons-sticky .fef-accordion-footer .fef-accordion-next,
.fef-buttons-sticky .fef-accordion-footer .fef-accordion-submit {
    min-width: 200px !important;
    max-width: 400px !important;
}

/* Add padding to body when sticky buttons active */
.fef-buttons-sticky .fef-accordion-body {
    padding-bottom: 80px !important;
}

/* ================================================================
 * FIXED (Scrollable Form, Fixed Buttons Below)
 * Form scrolls inside container, buttons stay at bottom of container
 * ================================================================*/
.fef-accordion-container.fef-buttons-fixed,
.fef-accordion-form.fef-buttons-fixed {
    position: relative;
    display: flex;
    flex-direction: column;
    max-height: var(--fef-accordion-height, 600px);
    overflow: hidden;
}

.fef-accordion-container.fef-buttons-fixed .fef-accordion-panel,
.fef-accordion-form.fef-buttons-fixed .fef-accordion-panel {
    flex: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.fef-accordion-container.fef-buttons-fixed .fef-accordion-content,
.fef-accordion-form.fef-buttons-fixed .fef-accordion-content {
    flex: 1;
    overflow-y: auto;
    max-height: calc(var(--fef-accordion-height, 600px) - 150px);
}

.fef-accordion-container.fef-buttons-fixed .fef-accordion-footer,
.fef-accordion-form.fef-buttons-fixed .fef-accordion-footer,
.fef-buttons-fixed .fef-accordion-footer {
    position: sticky !important;
    bottom: 0 !important;
    background: #fff !important;
    padding: 15px 20px !important;
    margin: 0 !important;
    z-index: 100 !important;
    border-top: 1px solid var(--fef-border, #e0e0e0) !important;
    flex-shrink: 0;
    display: flex !important;
    justify-content: flex-end !important;
}

/* ================================================================
 * FLOATING (Bubble in Corner)
 * ================================================================*/
.fef-accordion-container.fef-buttons-floating .fef-accordion-footer,
.fef-accordion-form.fef-buttons-floating .fef-accordion-footer,
.fef-buttons-floating .fef-accordion-footer {
    position: fixed !important;
    bottom: 30px !important;
    right: 30px !important;
    left: auto !important;
    width: auto !important;
    background: linear-gradient(135deg, var(--fef-floating-bg, #1a1a2e) 0%, var(--fef-floating-bg-end, #16213e) 100%) !important;
    border-radius: 50px !important;
    padding: 15px 30px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.3) !important;
    z-index: 99999 !important;
    margin: 0 !important;
    border: none !important;
}

.fef-buttons-floating .fef-accordion-footer .fef-accordion-next,
.fef-buttons-floating .fef-accordion-footer .fef-accordion-submit {
    background: transparent !important;
    border: 2px solid rgba(255,255,255,0.3) !important;
    color: #fff !important;
    padding: 12px 25px !important;
}

.fef-buttons-floating .fef-accordion-footer .fef-accordion-next:hover,
.fef-buttons-floating .fef-accordion-footer .fef-accordion-submit:hover {
    background: rgba(255,255,255,0.1) !important;
    border-color: rgba(255,255,255,0.5) !important;
}

/* Add bottom padding for floating */
.fef-buttons-floating .fef-accordion-body {
    padding-bottom: 30px !important;
}

/* ================================================================
 * CALENDAR EVENT POPUP STYLES
 * ================================================================*/
.fef-cal-event-popup {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 16px;
    padding: 25px;
    min-width: 320px;
    max-width: 450px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    z-index: 100000;
    animation: fef-popup-in 0.3s ease;
}

@keyframes fef-popup-in {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.9);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

.fef-cal-popup-close {
    position: absolute;
    top: 15px;
    right: 15px;
    background: #f5f5f5;
    border: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.fef-cal-popup-close:hover {
    background: #e0e0e0;
}

.fef-cal-popup-date {
    font-size: 13px;
    color: var(--fef-primary, #667eea);
    font-weight: 600;
    margin-bottom: 8px;
}

.fef-cal-popup-title {
    font-size: 20px;
    font-weight: 700;
    color: #333;
    margin: 0 0 12px 0;
    padding-right: 40px;
}

.fef-cal-popup-content {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
    margin-bottom: 15px;
}

.fef-cal-popup-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 20px;
    background: var(--fef-primary, #667eea);
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
}

.fef-cal-popup-link:hover {
    background: #5a6fd6;
    color: #fff;
}

.fef-cal-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 99999;
}

/* ================================================================
 * IMAGE CROPPER STYLES
 * ================================================================*/
.fef-cropper-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.85);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fef-cropper-container {
    background: #fff;
    border-radius: 12px;
    max-width: 90%;
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.fef-cropper-header {
    padding: 15px 20px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fef-cropper-header h4 {
    margin: 0;
    font-size: 16px;
}

.fef-cropper-close {
    background: none;
    border: none;
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    padding: 0;
    line-height: 1;
}

.fef-cropper-body {
    padding: 20px;
    flex: 1;
    overflow: auto;
}

.fef-cropper-image-container {
    max-height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.fef-cropper-image-container img {
    max-width: 100%;
    max-height: 100%;
}

.fef-cropper-footer {
    padding: 15px 20px;
    background: #f5f5f5;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.fef-cropper-btn {
    padding: 10px 20px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s;
}

.fef-cropper-btn-cancel {
    background: #e0e0e0;
    color: #333;
}

.fef-cropper-btn-cancel:hover {
    background: #d0d0d0;
}

.fef-cropper-confirm {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
}

.fef-cropper-confirm:hover {
    opacity: 0.9;
}

/* ================================================================
 * ADD TO CART BUTTON STYLES
 * ================================================================*/
.fef-add-to-cart-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 28px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    min-width: 180px;
}

.fef-add-to-cart-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(102,126,234,0.4);
}

.fef-add-to-cart-btn.loading {
    pointer-events: none;
    opacity: 0.7;
}

.fef-add-to-cart-btn .fef-cart-icon {
    font-size: 18px;
}

.fef-add-to-cart-success {
    display: none;
    color: var(--fef-success);
    margin-top: 10px;
    padding: 10px 15px;
    background: rgba(56,142,60,0.1);
    border-radius: 6px;
}

.fef-add-to-cart-btn.added + .fef-add-to-cart-success {
    display: block;
}

/* ================================================================
 * MULTI-SELECT BUTTONS
 * ================================================================*/
.fef-multi-select-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.fef-msb-layout-inline { flex-direction: row; }
.fef-msb-layout-vertical { flex-direction: column; }
.fef-msb-layout-grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); }
.fef-msb-layout-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); }
.fef-msb-layout-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); }

.fef-msb-item {
    cursor: pointer;
}

.fef-msb-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.fef-msb-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 16px 24px;
    background: #fff;
    border: 2px solid var(--fef-border, #e0e0e0);
    border-radius: 12px;
    transition: all 0.3s ease;
    position: relative;
    min-width: 100px;
    text-align: center;
}

.fef-msb-btn:hover {
    border-color: var(--fef-primary, #667eea);
    box-shadow: 0 4px 12px rgba(102,126,234,0.15);
}

.fef-msb-input:checked + .fef-msb-btn {
    border-color: var(--fef-primary, #667eea);
    background: linear-gradient(135deg, rgba(102,126,234,0.05) 0%, rgba(118,75,162,0.05) 100%);
    box-shadow: 0 4px 15px rgba(102,126,234,0.2);
}

.fef-msb-icon {
    font-size: 28px;
    color: var(--fef-text-light, #666);
}

.fef-msb-input:checked + .fef-msb-btn .fef-msb-icon {
    color: var(--fef-primary, #667eea);
}

.fef-msb-image img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 8px;
}

.fef-msb-label {
    font-size: 14px;
    font-weight: 500;
    color: var(--fef-text, #333);
}

.fef-msb-check {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 22px;
    height: 22px;
    background: var(--fef-primary, #667eea);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    opacity: 0;
    transform: scale(0.5);
    transition: all 0.2s ease;
}

.fef-msb-input:checked + .fef-msb-btn .fef-msb-check {
    opacity: 1;
    transform: scale(1);
}

/* ================================================================
 * ICON SELECTOR
 * ================================================================*/
.fef-icon-select {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.fef-icon-item {
    cursor: pointer;
}

.fef-icon-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.fef-icon-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 15px 20px;
    background: #fff;
    border: 2px solid var(--fef-border, #e0e0e0);
    border-radius: 10px;
    transition: all 0.3s ease;
    min-width: 80px;
}

.fef-icon-btn i {
    font-size: 24px;
    color: var(--fef-text-light, #666);
    transition: all 0.3s ease;
}

.fef-icon-btn:hover {
    border-color: var(--fef-primary, #667eea);
}

.fef-icon-input:checked + .fef-icon-btn {
    border-color: var(--fef-primary, #667eea);
    background: rgba(102,126,234,0.08);
}

.fef-icon-input:checked + .fef-icon-btn i {
    color: var(--fef-primary, #667eea);
    transform: scale(1.1);
}

.fef-icon-label {
    font-size: 12px;
    color: var(--fef-text-light, #666);
}

/* ================================================================
 * IMAGE SELECT
 * ================================================================*/
.fef-image-select {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 15px;
}

.fef-imgsel-item {
    cursor: pointer;
}

.fef-imgsel-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.fef-imgsel-box {
    display: block;
    position: relative;
    border: 3px solid transparent;
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
}

.fef-imgsel-box img {
    width: 100%;
    height: 100px;
    object-fit: cover;
    display: block;
}

.fef-imgsel-box:hover {
    border-color: var(--fef-primary, #667eea);
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.fef-imgsel-input:checked + .fef-imgsel-box {
    border-color: var(--fef-primary, #667eea);
    box-shadow: 0 4px 20px rgba(102,126,234,0.3);
}

.fef-imgsel-label {
    display: block;
    padding: 8px;
    text-align: center;
    font-size: 13px;
    background: #f9f9f9;
}

.fef-imgsel-check {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 26px;
    height: 26px;
    background: var(--fef-primary, #667eea);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    opacity: 0;
    transform: scale(0.5);
    transition: all 0.2s ease;
}

.fef-imgsel-input:checked + .fef-imgsel-box .fef-imgsel-check {
    opacity: 1;
    transform: scale(1);
}

/* ================================================================
 * CURRENT DATE/TIME DISPLAY
 * ================================================================*/
.fef-current-date-display,
.fef-current-time-display {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 15px 20px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 10px;
    border: 1px solid var(--fef-border, #e0e0e0);
}

.fef-date-icon,
.fef-time-icon {
    font-size: 24px;
}

.fef-date-value,
.fef-time-value {
    font-size: 18px;
    font-weight: 600;
    color: var(--fef-text, #333);
}

/* ================================================================
 * LABEL DISPLAY
 * ================================================================*/
.fef-label-display {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: #fff;
    border: 1px solid var(--fef-border, #e0e0e0);
    border-radius: 8px;
    font-size: 16px;
}

.fef-label-icon {
    font-size: 20px;
}

.fef-label-currency_icon .fef-label-value {
    font-size: 28px;
    font-weight: 700;
}

/* ================================================================
 * FULL CALENDAR
 * ================================================================*/
.fef-calendar-full {
    background: #fff;
    border: 1px solid var(--fef-border, #e0e0e0);
    border-radius: 12px;
    overflow: hidden;
    width: 100%;
}

.fef-cal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: linear-gradient(135deg, var(--fef-primary, #667eea) 0%, #764ba2 100%);
    color: #fff;
}

.fef-cal-title {
    font-size: 18px;
    font-weight: 600;
}

.fef-cal-prev,
.fef-cal-next {
    background: rgba(255,255,255,0.2);
    border: none;
    color: #fff;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.2s;
}

.fef-cal-prev:hover,
.fef-cal-next:hover {
    background: rgba(255,255,255,0.3);
}

.fef-cal-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    background: #f8f9fa;
    border-bottom: 1px solid var(--fef-border, #e0e0e0);
}

.fef-cal-weekdays span {
    padding: 12px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    color: var(--fef-text-light, #666);
}

.fef-cal-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
}

.fef-cal-day {
    padding: 8px 4px;
    text-align: center;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s;
    position: relative;
    min-height: 45px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.fef-cal-day-num {
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    color: #333;
    display: block;
}

.fef-cal-event-indicator {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-top: 4px;
    flex-shrink: 0;
}

.fef-cal-day:hover:not(.disabled):not(.other-month) {
    background: rgba(102,126,234,0.1);
}

.fef-cal-day.other-month {
    color: #ccc;
}

.fef-cal-day.other-month .fef-cal-day-num {
    color: #ccc;
}

.fef-cal-day.disabled {
    color: #ddd;
    cursor: not-allowed;
    background: #f9f9f9;
}

.fef-cal-day.disabled .fef-cal-day-num {
    color: #ddd;
}

.fef-cal-day.today {
    font-weight: 700;
}

.fef-cal-day.today .fef-cal-day-num {
    color: var(--fef-primary, #667eea);
    font-weight: 700;
}

.fef-cal-day.selected {
    background: var(--fef-primary, #667eea) !important;
    border-radius: 8px;
}

.fef-cal-day.selected .fef-cal-day-num {
    color: #fff !important;
}

.fef-cal-day.in-range {
    background: rgba(102,126,234,0.15);
}

.fef-cal-day.range-start {
    background: var(--fef-primary, #667eea);
    border-radius: 8px 0 0 8px;
}

.fef-cal-day.range-start .fef-cal-day-num {
    color: #fff;
}

.fef-cal-day.range-end {
    background: var(--fef-primary, #667eea);
    border-radius: 0 8px 8px 0;
}

.fef-cal-day.range-end .fef-cal-day-num {
    color: #fff;
}

/* Remove the ::after pseudo-element since we're using actual indicator element */
.fef-cal-day.has-event {
    background: var(--event-bg, rgba(78, 205, 196, 0.15));
}

.fef-cal-range-display {
    display: flex;
    justify-content: space-between;
    padding: 15px 20px;
    background: #f8f9fa;
    border-top: 1px solid var(--fef-border, #e0e0e0);
}

.fef-cal-range-display span {
    font-size: 14px;
    color: var(--fef-text-light, #666);
}

.fef-cal-range-display strong {
    color: var(--fef-primary, #667eea);
}

/* ================================================================
 * DOWNLOAD BUTTON
 * ================================================================*/
.fef-download-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    color: #fff;
    text-decoration: none;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.fef-download-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(17,153,142,0.4);
    color: #fff;
}

.fef-download-btn i {
    font-size: 18px;
}

/* ================================================================
 * TAXONOMY GROUPED — Searchable dropdown with parent headers
 * ================================================================*/
.fef-tax-grouped-wrap {
    position: relative;
    width: 100%;
}
.fef-tax-grouped-search {
    position: relative;
    display: flex;
    align-items: center;
}
.fef-tax-grouped-input {
    width: 100%;
    padding-right: 40px !important;
    cursor: pointer;
}
.fef-tax-grouped-arrow {
    position: absolute;
    right: 1px;
    top: 1px;
    bottom: 1px;
    width: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.15s;
    pointer-events: auto;
    background: #f8fafc;
    border-left: 1px solid #e2e8f0;
    border-radius: 0 6px 6px 0;
}
.fef-tax-grouped-arrow:hover {
    color: #1e293b;
    background: #f1f5f9;
}
.fef-tax-grouped-dropdown {
    position: fixed;
    z-index: 999999;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    max-height: 320px;
    overflow-y: auto;
}
.fef-tax-grouped-group {
    border-bottom: 1px solid #f1f5f9;
}
.fef-tax-grouped-group:last-child {
    border-bottom: none;
}
.fef-tax-grouped-header {
    padding: 10px 14px;
    font-size: var(--fef-tg-header-size, 11px);
    font-weight: 700;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    background: #f8fafc;
    position: sticky;
    top: 0;
    z-index: 1;
    border-bottom: 1px solid #e2e8f0;
}
.fef-tax-grouped-option {
    padding: 10px 14px 10px 20px;
    font-size: var(--fef-tg-option-size, 14px);
    color: #1e293b;
    cursor: pointer;
    transition: background 0.1s;
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid #f8fafc;
}
.fef-tax-grouped-option:last-child {
    border-bottom: none;
}
.fef-tax-grouped-option:hover {
    background: #f1f5f9;
}
.fef-tax-grouped-selected {
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 500;
}
.fef-tax-grouped-selected:hover {
    background: #dbeafe;
}
.fef-tax-grouped-option-text {
    display: flex;
    flex-direction: column;
    gap: 1px;
    flex: 1;
}
.fef-tax-grouped-breadcrumb {
    font-size: 11px;
    color: #94a3b8;
    font-weight: 400;
}
/* Category term image */
.fef-tax-grouped-img {
    width: 28px;
    height: 28px;
    border-radius: 4px;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid #e2e8f0;
}
/* Scrollbar styling */
.fef-tax-grouped-dropdown::-webkit-scrollbar {
    width: 6px;
}
.fef-tax-grouped-dropdown::-webkit-scrollbar-track {
    background: #f8fafc;
}
.fef-tax-grouped-dropdown::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 3px;
}

/* ================================================================
 * TAXONOMY BUTTONS
 * ================================================================*/
.fef-taxonomy-buttons {
    width: 100%;
}

.fef-taxbtn-parents {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.fef-taxbtn-inline .fef-taxbtn-parents { flex-direction: row; }
.fef-taxbtn-list .fef-taxbtn-parents { flex-direction: column; }
.fef-taxbtn-grid .fef-taxbtn-parents {
    display: grid;
    grid-template-columns: repeat(var(--columns, 3), 1fr);
}

.fef-taxbtn-item {
    cursor: pointer;
}

.fef-taxbtn-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.fef-taxbtn-btn {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    background: #fff;
    border: 2px solid var(--fef-border, #e0e0e0);
    border-radius: 10px;
    transition: all 0.3s ease;
}

.fef-taxbtn-btn:hover {
    border-color: var(--fef-primary, #667eea);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.fef-taxbtn-input:checked + .fef-taxbtn-btn {
    border-color: var(--fef-primary, #667eea);
    background: linear-gradient(135deg, rgba(102,126,234,0.08) 0%, rgba(118,75,162,0.08) 100%);
}

.fef-taxbtn-image {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    overflow: hidden;
}

.fef-taxbtn-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fef-taxbtn-label {
    flex: 1;
    font-weight: 500;
}

.fef-taxbtn-arrow {
    font-size: 10px;
    color: var(--fef-text-light, #666);
    transition: transform 0.3s;
}

.fef-taxbtn-input:checked + .fef-taxbtn-btn .fef-taxbtn-arrow {
    transform: rotate(180deg);
}

.fef-taxbtn-children-container {
    margin-top: 15px;
    padding: 15px;
    background: #f8f9fa;
    border-radius: 10px;
    animation: fef-slideDown 0.3s ease;
}

.fef-children-above {
    margin-top: 0;
    margin-bottom: 15px;
}

.fef-taxbtn-children {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.fef-taxbtn-child {
    padding: 10px 16px;
    background: #fff;
    border: 1px solid var(--fef-border, #e0e0e0);
    border-radius: 8px;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
}

.fef-taxbtn-child:hover {
    border-color: var(--fef-primary, #667eea);
}

.fef-taxbtn-child.selected {
    background: var(--fef-primary, #667eea);
    color: #fff;
    border-color: var(--fef-primary, #667eea);
}

@keyframes fef-slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ================================================================
 * TAXONOMY VISUAL GRID
 * ================================================================*/
.fef-taxonomy-visual {
    display: grid;
    grid-template-columns: repeat(var(--columns, 4), 1fr);
    gap: 20px;
}

.fef-taxvis-item {
    cursor: pointer;
}

.fef-taxvis-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.fef-taxvis-card {
    display: block;
    background: #fff;
    border: 2px solid var(--fef-border, #e0e0e0);
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
}

.fef-taxvis-card:hover {
    border-color: var(--fef-primary, #667eea);
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    transform: translateY(-4px);
}

.fef-taxvis-input:checked + .fef-taxvis-card {
    border-color: var(--fef-primary, #667eea);
    box-shadow: 0 8px 30px rgba(102,126,234,0.25);
}

.fef-taxvis-image {
    display: block;
    width: 100%;
    height: 120px;
    background-size: cover;
    background-position: center;
}

.fef-taxvis-placeholder {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.fef-taxvis-initial {
    font-size: 48px;
    font-weight: 700;
    color: rgba(255,255,255,0.8);
}

.fef-taxvis-info {
    padding: 15px;
    text-align: center;
}

.fef-taxvis-name {
    display: block;
    font-weight: 600;
    font-size: 15px;
    color: var(--fef-text, #333);
    margin-bottom: 4px;
}

.fef-taxvis-count {
    font-size: 13px;
    color: var(--fef-text-light, #666);
}

.fef-taxvis-check {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 28px;
    height: 28px;
    background: var(--fef-primary, #667eea);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    opacity: 0;
    transform: scale(0.5);
    transition: all 0.2s ease;
}

.fef-taxvis-input:checked + .fef-taxvis-card .fef-taxvis-check {
    opacity: 1;
    transform: scale(1);
}

/* ================================================================
 * TYPEWRITER PLACEHOLDER ANIMATION
 * ================================================================*/

/* ================================================================
 * WYSIWYG EDITOR — Visual/Code tabs inside toolbar
 * ================================================================*/
.fef-form-group .wp-editor-wrap {
    position: relative;
}
.fef-form-group .wp-editor-tabs {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    float: none;
    padding: 0;
    margin: 0;
}
.fef-form-group .wp-switch-editor {
    padding: 4px 10px;
    font-size: 11px;
    height: auto;
    line-height: 1.4;
    margin: 2px 2px 0 0;
    border: 1px solid #e0e0e0;
    background: #f5f5f5;
    color: #555;
    border-radius: 3px 3px 0 0;
}
.fef-form-group .wp-switch-editor.switch-tmce {
    border-radius: 3px 0 0 0;
}
.fef-form-group .wp-switch-editor.switch-html {
    border-radius: 0 3px 0 0;
}
.fef-form-group .tmce-active .switch-tmce,
.fef-form-group .html-active .switch-html {
    background: #fff;
    border-bottom-color: #fff;
    color: #1e293b;
    font-weight: 600;
}
.fef-form-group .wp-editor-container {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}
.fef-form-group .wp-editor-area {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 14px;
    color: #1e293b;
    line-height: 1.6;
    padding: 12px 14px;
}
.fef-form-group .mce-toolbar-grp {
    padding: 4px 4px 4px 4px;
    border-bottom: 1px solid #eee;
    background: #f9f9f9;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ================================================================
 * TYPEWRITER PLACEHOLDER ANIMATION (continued)
 * ================================================================*/
/* Placeholder color/size/weight are injected per-field via a dynamic
   <style> tag by JS — CSS custom properties on <input> cannot reach
   ::placeholder pseudo-elements (browser limitation). */
.fef-typewriter-field::placeholder {
    color: #666666;
    font-size: 21px;
    font-weight: 200;
    opacity: 1;
    transition: opacity 0.2s;
}
.fef-typewriter-field:focus::placeholder {
    opacity: 0.7;
}

/* ================================================================
 * INDIVIDUAL FIELD STYLING
 * ================================================================*/
.fef-form-control[style*="--custom-height"] {
    height: var(--custom-height) !important;
}

.fef-form-control[style*="--custom-font-size"] {
    font-size: var(--custom-font-size) !important;
}

.fef-form-control[style*="--custom-font-weight"] {
    font-weight: var(--custom-font-weight) !important;
}

.fef-form-control[style*="--custom-text-color"] {
    color: var(--custom-text-color) !important;
}

.fef-form-control[style*="--custom-bg-color"] {
    background-color: var(--custom-bg-color) !important;
}

.fef-form-control[style*="--custom-border-color"] {
    border-color: var(--custom-border-color) !important;
}

.fef-form-control[style*="--custom-border-radius"] {
    border-radius: var(--custom-border-radius) !important;
}

/* Responsive */
@media (max-width: 768px) {
    .fef-msb-layout-grid-3,
    .fef-msb-layout-grid-4 { grid-template-columns: repeat(2, 1fr); }
    
    .fef-taxonomy-visual { grid-template-columns: repeat(2, 1fr); }
    
    .fef-taxbtn-grid .fef-taxbtn-parents { grid-template-columns: repeat(2, 1fr); }
    
    .fef-image-select { grid-template-columns: repeat(2, 1fr); }
}
/* ================================================================
 * WORKING HOURS — INFO ALERT
 * ================================================================*/
.fef-wh-info-alert {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #fefce8;
    border: 1px solid #fde68a;
    border-radius: 6px;
    padding: 6px 12px;
    margin-bottom: 10px;
    font-size: 11px;
    line-height: 1.4;
    color: #92400e;
}
.fef-wh-info-alert i {
    color: #f59e0b;
    font-size: 11px;
    flex-shrink: 0;
}

/* ================================================================
 * WORKING HOURS — CLOSED STATE (disabled time fields)
 * ================================================================*/
.fef-rp-field-disabled {
    opacity: 0.38;
    pointer-events: none;
    user-select: none;
}
.fef-rp-field-disabled label {
    color: #aaa;
}
.fef-rp-field-disabled input,
.fef-rp-field-disabled select {
    background: #f5f5f5 !important;
    color: #bbb !important;
    cursor: not-allowed;
}

/* ================================================================
 * WORKING HOURS — HOLIDAYS SECTION
 * ================================================================*/
.fef-wh-holidays-section {
    margin-top: 10px;
    border-top: 1px solid #e5e7eb;
    padding-top: 0;
}

.fef-wh-holidays-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
}

.fef-wh-holidays-title {
    font-size: 16px;
    font-weight: 600;
    color: #6b7280;
    display: flex;
    align-items: center;
    gap: 15px;
}
.fef-wh-holidays-title i {
    color: #ef4444;
    font-size: 22px;
}

.fef-wh-add-holiday {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #1f2937;
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 5px 12px;
    font-size: 11px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
}
.fef-wh-add-holiday:hover {
    background: #374151;
}
.fef-wh-add-holiday i {
    font-size: 9px;
}

.fef-wh-holidays-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Holiday fields grid is defined in the new section below */

.fef-wh-holiday-date,
.fef-wh-holiday-title {
    padding: 4px 8px;
    font-size: 12px;
    border-radius: 4px;
}

.fef-wh-holiday-remove {
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    color: #9ca3af;
    cursor: pointer;
    font-size: 13px;
    padding: 2px 6px;
    border-radius: 3px;
    line-height: 1;
    transition: all 0.15s;
}
.fef-wh-holiday-remove:hover {
    background: #fee2e2;
    color: #dc2626;
    border-color: #fecaca;
}

@media (max-width: 600px) {
    .fef-wh-holiday-fields {
        grid-template-columns: 1fr 1fr;
    }
    .fef-wh-holiday-fields .fef-wh-holiday-title {
        grid-column: 1 / -1;
    }
    .fef-wh-holiday-remove {
        grid-column: 1 / -1;
        justify-self: end;
    }
}

/* ============================================================================
 * FEF OUTPUT STYLES — display styles for all repeater preset template outputs.
 * These apply to HTML generated by FEF_Output class methods and shortcodes.
 * Scope: .fef-out wrapper (does not conflict with form styles).
 * ============================================================================*/

/* ── Shared wrapper ── */
.fef-out {
    font-family: inherit;
    line-height: 1.6;
    color: inherit;
}
.fef-out-empty {
    color: #999;
    font-style: italic;
    font-size: 13px;
    margin: 0;
}
.fef-out-section-title {
    font-size: 15px;
    font-weight: 600;
    color: #444;
    margin: 0 0 12px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.fef-out-icon {
    display: inline-block;
    line-height: 1;
}

/* ── Badge (Open / Closed) ── */
.fef-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}
.fef-badge-open {
    background: #e8f5e9;
    color: #2e7d32;
    border: 1px solid #a5d6a7;
}
.fef-badge-closed {
    background: #fce4ec;
    color: #c62828;
    border: 1px solid #f48fb1;
}

/* ============================================================================
 * WORKING HOURS TABLE
 * ============================================================================*/
.fef-out-wh-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.fef-out-wh-row {
    border-bottom: 1px solid #f5f5f5;
    transition: background 0.15s;
}
.fef-out-wh-row:last-child {
    border-bottom: none;
}
.fef-out-wh-row:hover {
    background: #fafafa;
}
.fef-out-wh-row td {
    padding: 10px 8px;
    vertical-align: middle;
}
.fef-out-wh-day {
    font-weight: 600;
    color: #333;
    width: 120px;
}
.fef-out-wh-times {
    color: #555;
    font-variant-numeric: tabular-nums;
}
.fef-out-wh-sep {
    color: #bbb;
}
.fef-out-wh-closed .fef-out-wh-day {
    color: #aaa;
}
.fef-out-wh-closed-label {
    color: #ccc;
}
.fef-out-wh-badge {
    text-align: right;
    width: 80px;
}

/* ============================================================================
 * HOLIDAYS LIST
 * ============================================================================*/
.fef-out-holidays {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 2px dashed #f0f0f0;
}
.fef-out-holidays-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.fef-out-holiday-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 12px;
    background: #fff8f0;
    border: 1px solid #ffe0b2;
    border-left: 4px solid #fb8c00;
    border-radius: 6px;
    font-size: 13px;
}
.fef-out-holiday-date {
    font-weight: 600;
    color: #e65100;
    white-space: nowrap;
    min-width: 90px;
}
.fef-out-holiday-title {
    color: #555;
}

/* ============================================================================
 * BRANCHES / LOCATIONS
 * ============================================================================*/
.fef-out-branches {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 16px;
}
.fef-out-branch-card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 18px 20px;
    box-shadow: 0 1px 6px rgba(0,0,0,0.05);
    transition: box-shadow 0.2s;
}
.fef-out-branch-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}
.fef-out-branch-name {
    font-size: 16px;
    font-weight: 700;
    color: #222;
    margin: 0 0 12px;
    padding-bottom: 10px;
    border-bottom: 2px solid #f0f0f0;
}
.fef-out-branch-address,
.fef-out-branch-phone,
.fef-out-branch-email,
.fef-out-branch-exec {
    font-size: 13px;
    color: #555;
    margin: 6px 0;
    display: flex;
    align-items: flex-start;
    gap: 6px;
}
.fef-out-branch-phone a,
.fef-out-branch-email a {
    color: #667eea;
    text-decoration: none;
}
.fef-out-branch-phone a:hover,
.fef-out-branch-email a:hover {
    text-decoration: underline;
}

/* ============================================================================
 * CONTACT PERSONS
 * ============================================================================*/
.fef-out-contacts {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}
.fef-out-contact-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 16px 18px;
    flex: 1 1 240px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    transition: box-shadow 0.2s;
}
.fef-out-contact-card:hover {
    box-shadow: 0 4px 14px rgba(0,0,0,0.1);
}
.fef-out-contact-avatar {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea, #764ba2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.fef-out-contact-avatar span {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}
.fef-out-contact-info {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
}
.fef-out-contact-name {
    font-size: 15px;
    font-weight: 700;
    color: #222;
    display: block;
}
.fef-out-contact-role {
    font-size: 12px;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.fef-out-contact-phone,
.fef-out-contact-email {
    font-size: 13px;
    color: #667eea;
    text-decoration: none;
    display: block;
}
.fef-out-contact-phone:hover,
.fef-out-contact-email:hover {
    text-decoration: underline;
}

/* ============================================================================
 * SERVICES
 * ============================================================================*/
.fef-out-services {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.fef-out-service-card {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
    transition: box-shadow 0.2s;
}
.fef-out-service-card:hover {
    box-shadow: 0 4px 14px rgba(0,0,0,0.09);
}
.fef-out-service-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 8px;
}
.fef-out-service-name {
    font-size: 15px;
    font-weight: 700;
    color: #222;
    margin: 0;
    flex: 1;
}
.fef-out-service-price {
    font-size: 16px;
    font-weight: 700;
    color: #2e7d32;
    white-space: nowrap;
    flex-shrink: 0;
}
.fef-out-service-desc {
    font-size: 13px;
    color: #666;
    margin: 0;
    line-height: 1.6;
}

/* ============================================================================
 * SOCIAL LINKS
 * ============================================================================*/
.fef-out-social-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}
.fef-out-social-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 16px;
    border-radius: 8px;
    text-decoration: none;
    color: #fff !important;
    font-size: 13px;
    font-weight: 500;
    transition: opacity 0.2s, transform 0.15s;
    line-height: 1;
}
.fef-out-social-btn:hover {
    opacity: 0.88;
    transform: translateY(-1px);
    color: #fff !important;
    text-decoration: none;
}
.fef-out-social-btn i {
    font-size: 15px;
    line-height: 1;
}
.fef-out-social-label {
    display: inline-block;
}

/* Icon-only mode — add class "fef-icons-only" to the wrapper to hide labels */
.fef-out-social-links.fef-icons-only .fef-out-social-label {
    display: none;
}
.fef-out-social-links.fef-icons-only .fef-out-social-btn {
    width: 40px;
    height: 40px;
    padding: 0;
    justify-content: center;
    border-radius: 50%;
}

/* ============================================================================
 * RESPONSIVE
 * ============================================================================*/
@media (max-width: 600px) {
    .fef-out-branches {
        grid-template-columns: 1fr;
    }
    .fef-out-contact-card {
        flex: 1 1 100%;
    }
    .fef-out-wh-day {
        width: 90px;
    }
    .fef-out-wh-badge {
        width: 60px;
    }
    .fef-badge {
        font-size: 10px;
        padding: 2px 7px;
    }
}

/* ================================================================
 * REPEATER INLINE NOTICES
 * Replace browser alert() popups with these non-blocking inline
 * messages. Auto-dismiss after 2.5 seconds via JS fadeOut.
 * ================================================================*/
.fef-repeater-notice {
    background: #fff3e0;
    border: 1px solid #ffcc80;
    border-left: 4px solid #fb8c00;
    color: #e65100;
    font-size: 12px;
    font-weight: 500;
    padding: 7px 12px;
    border-radius: 4px;
    margin: 6px 0 8px;
    animation: fef-notice-in 0.2s ease;
}
.fef-repeater-notice-top {
    margin: 0 0 10px;
    animation: fef-notice-in 0.2s ease;
}
@keyframes fef-notice-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}
/* ================================================================
 * LIVE PREVIEW - RESTORE BUTTON (Fix 1)
 * ================================================================*/
.fef-preview-restore {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #667eea;
    color: #fff;
    border: none;
    border-radius: 20px 0 0 20px;
    padding: 6px 12px 6px 10px;
    font-size: 16px;
    cursor: pointer;
    box-shadow: -2px 2px 8px rgba(0,0,0,0.15);
    z-index: 10;
    transition: background 0.2s;
}
.fef-preview-restore:hover { background: #5a67d8; }

/* ================================================================
 * PREVIEW PANEL STEP ACCORDION (Fix 2a)
 * ================================================================*/
.fef-pa-section {
    border: 1px solid #e8edf3;
    border-radius: 8px;
    margin-bottom: 8px;
    overflow: hidden;
    background: #fff;
}
.fef-pa-section.fef-pa-single { border: none; background: transparent; }
.fef-pa-section.fef-pa-single .fef-pa-body { display: block !important; }

.fef-pa-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    cursor: pointer;
    background: #f5f7fa;
    border-bottom: 1px solid transparent;
    user-select: none;
    transition: background 0.15s;
}
.fef-pa-header:hover { background: #eef1f7; }
.fef-pa-section.fef-pa-open .fef-pa-header { border-bottom-color: #e8edf3; }

.fef-pa-step-num {
    width: 22px;
    height: 22px;
    background: #ffffff;
    color: #232323;
    font-size: 11px;
    font-weight: 700;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #e5e7eb;
}
.fef-pa-step-title {
    flex: 1;
    font-size: 12px;
    font-weight: 600;
    color: #374151;
}
.fef-pa-chevron {
    font-size: 16px;
    color: #9ca3af;
    transition: transform 0.2s;
    line-height: 1;
}
.fef-pa-section.fef-pa-open .fef-pa-chevron { transform: rotate(90deg); }

.fef-pa-body {
    padding: 10px 12px;
}

.fef-pa-field {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px;
    padding: 5px 0;
    border-bottom: 1px solid #f0f2f5;
    font-size: 12px;
    line-height: 1.4;
}
.fef-pa-field:last-child { border-bottom: none; }
.fef-pa-field-label {
    font-weight: 500;
    color: #ff7b08;
    min-width: 90px;
    flex-shrink: 0;
}
.fef-pa-field-value { color: #1f2937; }
.fef-pa-empty { color: #9ca3af; font-style: italic; }

/* ================================================================
 * WORKING HOURS PREVIEW (Fix 2)
 * ================================================================*/
.fef-wh-preview {
    width: 100%;
    font-size: 12px;
}
.fef-wh-preview-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 3px 0;
    border-bottom: 1px solid #f0f2f5;
    gap: 8px;
}
.fef-wh-preview-row:last-of-type { border-bottom: none; }
.fef-wh-preview-day {
    font-weight: 600;
    color: #374151;
    min-width: 70px;
}
.fef-wh-preview-time { color: #059669; font-weight: 500; }
.fef-wh-preview-closed { color: #dc2626; font-weight: 500; }

.fef-wh-preview-holidays {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px dashed #d1d5db;
}
.fef-wh-preview-holidays-title {
    font-size: 11px;
    font-weight: 700;
    color: #6b7280;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.fef-wh-preview-holiday-item {
    display: flex;
    gap: 6px;
    align-items: center;
    padding: 2px 0;
    font-size: 11px;
}
.fef-wh-preview-holiday-date {
    background: #fef3c7;
    color: #92400e;
    border-radius: 3px;
    padding: 1px 5px;
    font-weight: 600;
    white-space: nowrap;
}
.fef-wh-preview-holiday-name { color: #374151; }

/* ================================================================
 * REPEATER SKIP TOGGLE
 * ================================================================*/
.fef-repeater-skip-bar {
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, #fef3c7, #fff7ed);
    border: 1px solid #fbbf24;
    border-radius: 8px;
    padding: 10px 16px;
    margin-bottom: 14px;
}
.fef-repeater-skip-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
    font-size: 13px;
    font-weight: 500;
    color: #92400e;
}
.fef-repeater-skip-toggle input[type="checkbox"] {
    display: none;
}
.fef-skip-slider {
    width: 40px;
    height: 22px;
    background: #d1d5db;
    border-radius: 22px;
    position: relative;
    transition: background 0.3s;
    flex-shrink: 0;
}
.fef-skip-slider::after {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    background: #fff;
    border-radius: 50%;
    transition: transform 0.3s;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.fef-repeater-skip-checkbox:checked + .fef-skip-slider {
    background: #f59e0b;
}
.fef-repeater-skip-checkbox:checked + .fef-skip-slider::after {
    transform: translateX(18px);
}
.fef-skip-label {
    line-height: 1.3;
}
.fef-repeater-skipped .fef-repeater-items,
.fef-repeater-skipped .fef-repeater-add,
.fef-repeater-skipped .fef-wh-info-alert,
.fef-repeater-skipped .fef-wh-toggle-bar,
.fef-repeater-skipped .fef-wh-holidays-section,
.fef-repeater-skipped .fef-wh-table-header {
    display: none !important;
}
.fef-repeater-skipped {
    opacity: 0.7;
}
.fef-repeater-skipped .fef-repeater-skip-bar {
    background: linear-gradient(135deg, #fef9c3, #fefce8);
    border-color: #facc15;
    opacity: 1;
}

/* ================================================================
 * WORKING HOURS — CLEAN TABLE LAYOUT
 * ================================================================*/
.fef-wh-table-header {
    display: grid;
    grid-template-columns: 140px 140px 1fr;
    gap: 12px;
    align-items: center;
    padding: 10px 16px;
    background: #f9fafb;
    border-bottom: 1px solid #e5e7eb;
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.fef-wh-row {
    display: grid;
    grid-template-columns: 140px 140px 1fr;
    gap: 12px;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid #f3f4f6;
    transition: background 0.15s;
    background: #fff;
}
.fef-wh-row:last-child {
    border-bottom: none;
}
.fef-wh-row:hover {
    background: #fafbfc;
}
.fef-wh-row-closed {
    background: #fafafa;
}
.fef-wh-row-closed .fef-wh-day-name {
    color: #9ca3af;
}
.fef-wh-day-name {
    font-weight: 600;
    font-size: 13px;
    color: #374151;
}

/* Status toggle buttons */
.fef-wh-status-toggle {
    display: inline-flex;
    gap: 6px;
    border-radius: 4px;
    overflow: visible;
    border: none;
}
.fef-wh-status-btn {
    padding: 4px 14px;
    font-size: 12px;
    font-weight: 500;
    border: 1px solid #D3D3D3;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
    background: #D3D3D3;
    color: #555;
    line-height: 1.4;
    letter-spacing: 0.01em;
}
.fef-wh-status-btn:hover:not(.active) {
    background: #eb8110;
    color: #fff;
    border-color: #eb8110;
}
/* Active: Open = orange */
.fef-wh-btn-open.active {
    background: #eb8110;
    color: #fff;
    font-weight: 600;
    border-color: #eb8110;
}
/* Active: Closed = dark */
.fef-wh-btn-closed.active {
    background: #1f2937;
    color: #fff;
    font-weight: 600;
    border-color: #1f2937;
}

/* Time inputs row */
.fef-wh-times {
    display: flex;
    align-items: center;
    gap: 8px;
}
.fef-wh-time-input {
    padding: 5px 8px !important;
    font-size: 13px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 5px !important;
    width: 120px;
    background: #fff;
    color: #374151;
}
.fef-wh-time-input:focus {
    border-color: #93c5fd !important;
    outline: none;
    box-shadow: 0 0 0 2px rgba(59,130,246,0.1);
}
.fef-wh-time-sep {
    color: #9ca3af;
    font-size: 14px;
    font-weight: 300;
}
.fef-wh-times-disabled {
    opacity: 0.3;
    pointer-events: none;
}
.fef-wh-times-disabled .fef-wh-time-input {
    background: #f9fafb !important;
    color: #d1d5db !important;
}

/* Hidden status val */
.fef-wh-status-val {
    display: none;
}
/* Holidays accordion header */
.fef-wh-holidays-accordion-header {
    cursor: pointer;
    user-select: none;
}
.fef-wh-holidays-accordion-header:hover {
    opacity: 0.85;
}
/* Accordion toggle — used by holidays section */
.fef-accordion-toggle {
    background: none;
    border: 1px solid #d1d5db;
    border-radius: 50%;
    cursor: pointer;
    padding: 0;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6b7280;
    font-size: 10px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    line-height: 1;
}
.fef-accordion-toggle:hover {
    background: #f3f4f6;
    color: #374151;
    border-color: #9ca3af;
}
.fef-accordion-closed > .fef-wh-holidays-accordion-header .fef-accordion-toggle i {
    transform: rotate(-90deg);
}
.fef-wh-holidays-section.fef-accordion-closed > .fef-wh-holidays-body {
    display: none !important;
}

/* ================================================================
 * HOLIDAYS — OPEN / CLOSE TIME FIELDS
 * ================================================================*/
.fef-wh-holiday-fields {
    display: grid;
    grid-template-columns: 130px 1fr 110px 110px auto;
    gap: 8px;
    align-items: center;
    background: #fff;
    border: 1px solid #f0f0f0;
    border-radius: 6px;
    padding: 8px 10px;
}
.fef-wh-holiday-open,
.fef-wh-holiday-close {
    padding: 6px 8px;
    font-size: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}
@media (max-width: 600px) {
    .fef-wh-holiday-fields {
        grid-template-columns: 1fr 1fr;
    }
    .fef-wh-holiday-fields .fef-wh-holiday-title {
        grid-column: 1 / -1;
    }
    .fef-wh-holiday-open,
    .fef-wh-holiday-close {
        min-width: 0;
    }
    .fef-wh-holiday-remove {
        grid-column: 1 / -1;
        justify-self: end;
    }
}

/* ================================================================
 * REPEATER — IMAGE UPLOAD FIELD
 * ================================================================*/
.fef-rp-image-upload {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
}
.fef-rp-image-preview {
    width: 60px;
    height: 60px;
    border: 2px dashed #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fafafa;
    flex-shrink: 0;
}
.fef-rp-image-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.fef-rp-image-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: #f0f4ff;
    color: #4f46e5;
    border: 1px solid #c7d2fe;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}
.fef-rp-image-btn:hover {
    background: #eb8110;
    color: #fff;
    border-color: #eb8110;
}
.fef-rp-image-remove {
    background: none;
    border: none;
    color: #ef4444;
    cursor: pointer;
    font-size: 14px;
    padding: 4px;
}

/* ================================================================
 * REPEATER — GALLERY UPLOAD FIELD
 * ================================================================*/
.fef-rp-gallery-upload {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.fef-rp-gallery-preview {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.fef-rp-gallery-thumb {
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
}
.fef-rp-gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
}
.fef-rp-gallery-thumb-remove {
    position: absolute;
    top: -6px;
    right: -6px;
    background: #1f2937;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    font-size: 9px;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    box-shadow: 0 1px 4px rgba(0,0,0,.2);
    z-index: 2;
    transition: all .15s;
}
.fef-rp-gallery-thumb-remove:hover {
    background: #dc2626;
    transform: scale(1.1);
}

/* ================================================================
 * REPEATER — WORKING SLOTS FIELD
 * ================================================================*/
.fef-rp-working-slots {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.fef-rp-slots-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.fef-rp-slot-fields {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 6px 10px;
    flex-wrap: wrap;
}
.fef-rp-slot-fields label {
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    min-width: auto;
    margin-bottom: 0;
}
.fef-rp-slot-fields input[type="time"] {
    width: 120px;
    padding: 4px 8px;
    font-size: 12px;
}
.fef-rp-slot-duration {
    font-size: 11px;
    color: #94a3b8;
    font-style: italic;
    min-width: 80px;
}
.fef-rp-slot-duration-valid {
    color: #059669;
    font-weight: 600;
    font-style: normal;
}
.fef-rp-slot-remove {
    background: none;
    border: none;
    color: #ef4444;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 4px;
}
.fef-rp-add-slot,
.fef-rp-add-url {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    background: #f0f9ff;
    color: #0369a1;
    border: 1px dashed #7dd3fc;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    align-self: flex-start;
}
.fef-rp-add-slot:hover,
.fef-rp-add-url:hover {
    background: #0369a1;
    color: #fff;
    border-style: solid;
    border-color: #0369a1;
}

/* ================================================================
 * REPEATER — MULTI URL FIELD (YouTube etc.)
 * ================================================================*/
.fef-rp-multi-url {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.fef-rp-url-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.fef-rp-url-entry {
    display: flex;
    gap: 6px;
    align-items: center;
}
.fef-rp-url-entry input {
    flex: 1;
}
.fef-rp-url-remove {
    background: none;
    border: none;
    color: #ef4444;
    cursor: pointer;
    font-size: 14px;
    padding: 2px 4px;
}

/* ================================================================
 * REPEATER — SOCIAL ICON DISPLAY
 * ================================================================*/
.fef-rp-social-icon-display {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
}
.fef-rp-social-icon-preview {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f0f4ff;
    color: #4f46e5;
    font-size: 16px;
    border: 1px solid #e0e7ff;
    transition: all 0.2s;
}

/* ================================================================
 * SOCIAL LINKS — COMPACT INLINE ROW LAYOUT
 * ================================================================*/
.fef-repeater-type-social_links .fef-repeater-items {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}
.fef-social-row {
    display: grid;
    grid-template-columns: 160px 36px 1fr 32px;
    gap: 8px;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px solid #f3f4f6;
    background: #fff;
    transition: background 0.15s;
}
.fef-social-row:last-child {
    border-bottom: none;
}
.fef-social-row:hover {
    background: #fafbfc;
}
.fef-social-platform {
    padding: 5px 8px !important;
    font-size: 12px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 4px !important;
}
.fef-social-icon-cell {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f0f4ff;
    color: #4f46e5;
    font-size: 14px;
    border: 1px solid #e0e7ff;
    flex-shrink: 0;
}
.fef-social-url {
    padding: 5px 10px !important;
    font-size: 13px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 4px !important;
}
.fef-social-url:focus {
    border-color: #93c5fd !important;
    outline: none;
    box-shadow: 0 0 0 2px rgba(59,130,246,0.1);
}
.fef-social-remove {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    color: #9ca3af;
    cursor: pointer;
    font-size: 12px;
    transition: all 0.15s;
    flex-shrink: 0;
}
.fef-social-remove:hover {
    background: #fee2e2;
    color: #dc2626;
    border-color: #fecaca;
}
/* ================================================================
   FRONTEND DATATABLE v3 — Complete Styles
   ================================================================ */

/* ── BASE ── */
.fef-dt-wrap{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;font-size:var(--fdt-row-font,14px);color:var(--fdt-text,#475569);background:var(--fdt-body-bg,#fff);border-radius:var(--fdt-rad,12px)}

/* ── TOOLBAR ── */
.fef-dt-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:16px;padding:var(--fdt-bar-pad,12px 0);background:transparent;border-radius:0;border:none}
.fef-dt-toolbar-l,.fef-dt-toolbar-r{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fef-dt-count{font-size:13px;color:#64748b;background:#fff;padding:6px 14px;border-radius:8px;border:1px solid #e2e8f0;white-space:nowrap;font-weight:500}
.fef-dt-count strong{color:#1e293b;font-weight:700}
.fef-dt-pp-form{display:inline-flex}
.fef-dt-pp-sel{padding:6px 10px;border:1px solid #e2e8f0;border-radius:8px;font-size:13px;background:#fff;cursor:pointer;color:#475569}
.fef-dt-search-form{display:inline-flex}
.fef-dt-search-wrap{position:relative;display:flex;align-items:center;flex-direction:var(--fdt-srch-icon-pos,row)}
.fef-dt-search-box{position:relative;display:flex;align-items:center}
.fef-dt-search-icon{position:absolute;left:12px;color:#94a3b8;pointer-events:none;font-size:14px;z-index:1;transition:color .2s}
.fef-dt-search-ico{position:absolute;left:12px;color:#94a3b8;pointer-events:none;font-size:14px}
.fef-dt-search-inp{padding:8px 12px 8px 36px;border:1px solid var(--fdt-srch-border,#e2e8f0);border-radius:var(--fdt-srch-rad,8px);font-size:13px;width:var(--fdt-srch-w,220px);outline:none;transition:all .2s;background:var(--fdt-srch-bg,#fff);color:#475569}
.fef-dt-search-inp:focus{border-color:#93c5fd;box-shadow:0 0 0 3px rgba(59,130,246,.08);width:calc(var(--fdt-srch-w,220px) + 40px)}
.fef-dt-search-clear{position:absolute;right:8px;font-size:18px;color:#94a3b8;text-decoration:none;line-height:1}
.fef-dt-search-clear:hover{color:#ef4444}

/* ── BUTTONS (themeable) ── */
.fef-dt-btn{display:inline-flex;align-items:center;gap:6px;padding:var(--fdt-btn-pad,8px 18px);border-radius:var(--fdt-btn-rad,8px);font-size:var(--fdt-btn-font,13px);font-weight:var(--fdt-btn-weight,500);text-decoration:none;cursor:pointer;border:none;transition:all .2s;white-space:nowrap}
.fef-dt-btn-primary{background:var(--fdt-btn-bg,#1e293b);color:var(--fdt-btn-text,#fff)}
.fef-dt-btn-primary:hover{opacity:.9;box-shadow:0 2px 8px rgba(0,0,0,.1);color:var(--fdt-btn-text,#fff)}
.fef-dt-btn-outline{background:#fff;color:#475569;border:1px solid #e2e8f0}
.fef-dt-btn-outline:hover{border-color:#94a3b8;color:#1e293b;background:#f8fafc}
.fef-dt-btn-sm{padding:5px 12px;font-size:12px}
.fef-dt-btn-danger{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}
.fef-dt-btn-danger:hover{background:#dc2626;color:#fff}
.fef-dt-bulk-bar{display:flex;align-items:center;gap:8px;padding:4px 10px;background:#fef3c7;border-radius:6px;font-size:12px;color:#92400e}

/* ── TABLE ── */
.fef-dt-table-outer{overflow-x:auto;border-radius:var(--fdt-rad,12px);border:1px solid #e2e8f0;background:#fff}
.fef-dt-table{width:100%;border-collapse:collapse}
.fef-dt-table thead{background:var(--fdt-hdr-bg,#f8fafc)}
.fef-dt-table th{padding:var(--fdt-hdr-pad,14px 16px);text-align:left;font-weight:var(--fdt-hdr-weight,500);color:var(--fdt-hdr-text,#64748b);font-size:var(--fdt-hdr-font,13px);text-transform:none;letter-spacing:0;border-bottom:1px solid #e2e8f0;white-space:nowrap}
.fef-dt-table th i{margin-right:4px;font-size:12px;opacity:.5}
.fef-dt-table td{padding:var(--fdt-row-pad,14px 16px);border-bottom:1px solid #f0f0f0;vertical-align:middle;color:var(--fdt-text,#475569);font-size:14px}
.fef-dt-table tbody tr.fef-dt-row{background:#fff !important}
.fef-dt-table tbody tr.fef-dt-row td{background-color:#fff !important}
.fef-dt-table tbody tr:last-child td{border-bottom:none}
.fef-dt-sticky-hdr .fef-dt-table thead th{position:sticky;top:0;z-index:10;background:var(--fdt-hdr-bg,#f8fafc)}
.fef-dt-striped .fef-dt-table tbody tr.fef-dt-row:nth-child(even){background:#f5f6f7 !important}
.fef-dt-striped .fef-dt-table tbody tr.fef-dt-row:nth-child(even) td{background-color:#f5f6f7 !important}
.fef-dt-striped .fef-dt-table tbody tr.fef-dt-row:nth-child(odd){background:#fff !important}
.fef-dt-striped .fef-dt-table tbody tr.fef-dt-row:nth-child(odd) td{background-color:#fff !important}
.fef-dt-hover .fef-dt-table tbody tr.fef-dt-row:hover{background:#eef1f5 !important}
.fef-dt-hover .fef-dt-table tbody tr.fef-dt-row:hover td{background-color:#eef1f5 !important}
.fef-dt-sort-link{color:var(--fdt-hdr-text,#64748b);text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.fef-dt-sort-link:hover{color:#1e293b}
.fef-dt-th-cb,.fef-dt-td-cb{width:40px;text-align:center}
.fef-dt-th-cb input[type="checkbox"],.fef-dt-td-cb input[type="checkbox"]{width:16px;height:16px;accent-color:#10b981;cursor:pointer;border-radius:4px}
.fef-dt-th-exp,.fef-dt-td-exp{width:40px;text-align:center}
.fef-dt-th-sr,.fef-dt-td-sr{width:44px;text-align:center;color:#94a3b8;font-size:13px}
.fef-dt-th-img,.fef-dt-td-img{width:calc(var(--fdt-img) + 24px)}
.fef-dt-cell-img{width:var(--fdt-img);height:var(--fdt-img);object-fit:cover;border-radius:8px;border:1px solid #e2e8f0;display:block;transition:transform .2s}
.fef-dt-cell-img:hover{transform:scale(1.05)}
.fef-dt-no-img{width:var(--fdt-img);height:var(--fdt-img);display:flex;align-items:center;justify-content:center;background:#f8fafc;border-radius:8px;color:#cbd5e1;font-size:16px;border:1px solid #e2e8f0}
.fef-dt-td-title{font-weight:600;width:100%}
.fef-dt-td-title a{color:#1e293b;text-decoration:none;transition:color .15s}
.fef-dt-td-title a:hover{color:var(--fdt-primary,#3b82f6)}
.fef-dt-td-excerpt{max-width:200px;font-size:13px;color:#64748b;line-height:1.5}
.fef-dt-td-date{white-space:nowrap;color:#94a3b8;font-size:13px}
.fef-dt-td-id{color:#94a3b8;font-family:monospace;font-size:12px}
.fef-dt-td-qty{width:70px}
.fef-dt-qty-inp{width:56px;padding:5px 8px;border:1px solid #e2e8f0;border-radius:6px;text-align:center;font-size:13px}
.fef-dt-na{color:#cbd5e1}
.fef-dt-link{color:var(--fdt-primary,#3b82f6);text-decoration:none}
.fef-dt-link:hover{text-decoration:underline}
.fef-dt-gallery{display:flex;gap:4px;flex-wrap:wrap}
.fef-dt-gallery img{width:32px;height:32px;object-fit:cover;border-radius:6px;border:1px solid #e2e8f0}
.fef-dt-more{font-size:10px;color:#94a3b8;background:#f1f5f9;padding:2px 6px;border-radius:10px}
.fef-dt-video-embed{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border-radius:8px}
.fef-dt-video-embed iframe{position:absolute;top:0;left:0;width:100%;height:100%}
.fef-dt-color-swatch{display:inline-block;width:20px;height:20px;border-radius:4px;border:2px solid #fff;box-shadow:0 0 0 1px #e2e8f0;vertical-align:middle}
.fef-dt-badge{display:inline-block;padding:3px 10px;border-radius:6px;font-size:12px;font-weight:500;background:#f1f5f9;color:#475569;white-space:nowrap}
.fef-dt-status{display:inline-block;padding:4px 12px;border-radius:6px;font-size:12px;font-weight:500;text-transform:capitalize}
.fef-dt-status-publish{background:#dcfce7;color:#166534}
.fef-dt-status-pending{background:#e0e7ff;color:#3730a3}
.fef-dt-status-draft{background:#f1f5f9;color:#475569}
.fef-dt-status-private{background:#ede9fe;color:#5b21b6}
.fef-dt-status-trash{background:#fee2e2;color:#991b1b}
.fef-dt-longtext{max-width:300px;line-height:1.5;font-size:13px}
.fef-dt-price-tag{font-weight:700;color:#166534;font-size:14px}

/* ── ACTION BUTTONS — minimal icon style, no borders ── */
.fef-dt-th-act{white-space:nowrap;text-align:right !important;width:1%;padding-right:16px !important}
.fef-dt-td-act{white-space:nowrap;text-align:right}
.fef-dt-act{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;text-decoration:none;transition:all .15s;cursor:pointer;border:none !important;background:transparent !important;color:#94a3b8;padding:0;font-size:15px;vertical-align:middle}
.fef-dt-act:hover{background:#f1f5f9 !important;color:#475569;transform:none}
.fef-dt-act-view{color:#94a3b8}.fef-dt-act-view:hover{color:#475569;background:#f1f5f9 !important}
.fef-dt-act-qv{color:#94a3b8}.fef-dt-act-qv:hover{color:#475569;background:#f1f5f9 !important}
.fef-dt-act-edit{color:#94a3b8}.fef-dt-act-edit:hover{color:#475569;background:#f1f5f9 !important}
.fef-dt-act-del{color:#cbd5e1}.fef-dt-act-del:hover{color:#ef4444;background:#fef2f2 !important}
.fef-dt-act-cart{color:#94a3b8}.fef-dt-act-cart:hover{color:#16a34a;background:#f0fdf4 !important}
.fef-dt-act-wish{color:#94a3b8}.fef-dt-act-wish:hover{color:#db2777;background:#fdf2f8 !important}
.fef-dt-act-compare{color:#94a3b8}.fef-dt-act-compare:hover{color:#0284c7;background:#f0f9ff !important}
.fef-dt-act-apply{color:#94a3b8}.fef-dt-act-apply:hover{color:#6d28d9;background:#f5f3ff !important}
.fef-dt-act-reorder{color:#94a3b8}.fef-dt-act-reorder:hover{color:#ea580c;background:#fff7ed !important}
.fef-dt-act-shortlist{color:#94a3b8}.fef-dt-act-shortlist:hover{color:#ca8a04;background:#fefce8 !important}
.fef-dt-act-pdf{color:#94a3b8}.fef-dt-act-pdf:hover{color:#dc2626;background:#fef2f2 !important}
.fef-dt-act-success{background:#dcfce7!important;color:#16a34a!important}
.fef-dt-wish-active i{color:var(--fdt-primary)!important}
.fef-dt-compare-active i{color:var(--fdt-primary)!important}
.fef-dt-card-actions{display:flex;align-items:center;gap:4px}

/* ── STATUS TOGGLE ── */
.fef-dt-status-toggle{cursor:pointer;border:none;font-family:inherit;transition:all .2s ease}
.fef-dt-status-toggle:hover{transform:scale(1.03);box-shadow:0 2px 6px rgba(0,0,0,.08)}
.fef-dt-status-toggle:active{transform:scale(0.97)}

/* ── ACTION BUTTON LABELS ── */
.fef-dt-act-label{font-size:11px;font-weight:500;white-space:nowrap;margin-left:2px}
.fef-dt-act.fef-dt-act-has-label{width:auto;height:auto;padding:5px 12px;gap:4px;border-radius:8px}

/* ── BULK BAR ENHANCED ── */
.fef-dt-bulk-bar{align-items:center;gap:10px;padding:6px 14px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;animation:fef-dt-slide-in .2s ease}
@keyframes fef-dt-slide-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.fef-dt-bulk-count{font-size:12px;font-weight:600;color:#991b1b}
.fef-dt-btn-danger{background:#ef4444!important;color:#fff!important;border:none!important;border-radius:8px!important}
.fef-dt-btn-danger:hover{background:#dc2626!important}

/* ── DELETE BUTTON ENHANCED ── */
.fef-dt-del-btn{background:transparent;border:none;cursor:pointer;padding:0}

/* ── EXPAND ROW ── */
.fef-dt-expand-btn{background:#1e293b !important;border:none !important;cursor:pointer;padding:0;color:#fff !important;transition:all .2s;display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;font-size:9px;line-height:1}
.fef-dt-expand-btn:hover{background:#475569 !important;color:#fff !important}
.fef-dt-exp-open .fef-dt-expand-btn{background:#475569 !important}
.fef-dt-exp-open i{transform:rotate(90deg)}
.fef-dt-exp-row td{padding:0!important;background:#f8fafc}
.fef-dt-exp-inner{padding:20px 24px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.fef-dt-exp-field{background:#fff;padding:12px 16px;border-radius:10px;border:1px solid #e2e8f0}
.fef-dt-exp-field label{display:block;font-size:11px;font-weight:600;color:#94a3b8;margin-bottom:4px;letter-spacing:0}
.fef-dt-exp-field div{font-size:14px;color:#1e293b;word-break:break-word}

/* ── EMPTY STATE ── */
.fef-dt-empty{text-align:center;padding:60px 20px;background:#fff;border-radius:var(--fdt-rad,12px);border:2px dashed #e2e8f0}
.fef-dt-empty-icon{font-size:48px;margin-bottom:12px}
.fef-dt-empty h3{font-size:18px;color:#1e293b;margin:0 0 8px}
.fef-dt-empty p{font-size:14px;color:#64748b;margin:0}

/* ── PAGINATION (themeable) ── */
.fef-dt-pagination{display:flex;align-items:center;justify-content:var(--fdt-pg-align,space-between);margin-top:16px;padding:8px 0;flex-wrap:wrap;gap:8px}
.fef-dt-pg-info{font-size:13px;color:#94a3b8}
.fef-dt-pagination a,.fef-dt-pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:var(--fdt-pg-size,34px);height:var(--fdt-pg-size,34px);padding:0 8px;border-radius:var(--fdt-pg-rad,8px);font-size:13px;text-decoration:none;border:1px solid #e2e8f0;color:var(--fdt-pg-text,#475569);background:var(--fdt-pg-bg,#fff);transition:all .15s}
.fef-dt-pagination a:hover{background:var(--fdt-pg-active,#1e293b);color:#fff;border-color:var(--fdt-pg-active,#1e293b)}
.fef-dt-pagination span.current{background:var(--fdt-pg-active,#1e293b);color:#fff;border-color:var(--fdt-pg-active,#1e293b);font-weight:600}
.fef-dt-pagination .dots{border:none;background:none}

/* ── LIGHTBOX ── */
.fef-dt-lb-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:9999999;align-items:center;justify-content:center;padding:20px}
.fef-dt-lb-overlay.fef-dt-lb-active{display:flex}
.fef-dt-lb-close{position:absolute;top:16px;right:20px;background:rgba(255,255,255,.2);border:none;color:#fff;font-size:28px;cursor:pointer;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:2}
.fef-dt-lb-close:hover{background:rgba(255,255,255,.4)}
.fef-dt-lb-img{max-width:90vw;max-height:85vh;object-fit:contain;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.3);animation:fefFadeIn .2s ease}

/* ── QUICKVIEW ── */
.fef-dt-qv-overlay{display:none;position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:999999;align-items:center;justify-content:center;backdrop-filter:blur(4px);padding:20px}
.fef-dt-qv-overlay.fef-dt-qv-active{display:flex}
.fef-dt-qv-modal{background:#fff;border-radius:12px;width:var(--fdt-qv-w,720px);max-width:95vw;max-height:var(--fdt-qv-h,650px);overflow-y:auto;position:relative;box-shadow:0 25px 50px rgba(0,0,0,.15);animation:fefSlideUp .25s ease}
.fef-dt-qv-close{position:absolute;top:10px;right:12px;background:none;border:none;font-size:24px;cursor:pointer;color:#94a3b8;z-index:2;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px}
.fef-dt-qv-close:hover{background:#f1f5f9;color:#0f172a}
.fef-dt-qv-body{padding:24px}
.fef-dt-qv-loading{display:flex;align-items:center;justify-content:center;gap:10px;padding:40px;color:#94a3b8}
.fef-dt-qv-header{display:flex;gap:16px;margin-bottom:20px;align-items:flex-start}
.fef-dt-qv-featured{width:120px;height:120px;object-fit:cover;border-radius:10px;flex-shrink:0}
.fef-dt-qv-title-area h2{margin:0 0 8px;font-size:20px;color:#0f172a;padding-right:30px}
.fef-dt-qv-meta{display:flex;gap:8px;flex-wrap:wrap}
.fef-dt-qv-date,.fef-dt-qv-author{font-size:12px;color:#94a3b8;display:inline-flex;align-items:center;gap:4px}
.fef-dt-qv-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}
.fef-dt-qv-field{background:#f8fafc;padding:10px 14px;border-radius:8px}
.fef-dt-qv-field label{display:block;font-size:10px;font-weight:700;text-transform:uppercase;color:#94a3b8;margin-bottom:4px}
.fef-dt-qv-field div{font-size:13px;color:#1e293b}
.fef-dt-qv-footer{padding-top:16px;border-top:1px solid #f1f5f9;display:flex;justify-content:flex-end}
@keyframes fefSlideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fefFadeIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}

/* ════════════════════════════════════════════════════════════
   DOCTOR APPOINTMENT TEMPLATE (Practo-style)
   ════════════════════════════════════════════════════════════ */
.fef-dt-tpl-doctor{display:flex;flex-direction:column;gap:0;background:#fff;border-radius:var(--fdt-rad);border:1px solid var(--fdt-border);overflow:hidden}
.fef-dt-doctor-card{padding:24px 28px;border-bottom:1px solid #e5e7eb;transition:background .2s}
.fef-dt-doctor-card:hover{background:#fafbfd}
.fef-dt-doctor-card:last-child{border-bottom:none}
.fef-dt-doctor-row{display:flex;gap:20px;align-items:flex-start}
.fef-dt-doctor-photo{flex-shrink:0;width:140px}
.fef-dt-doctor-photo img{width:140px;height:140px;object-fit:cover;border-radius:12px;border:2px solid #e5e7eb;transition:border-color .2s}
.fef-dt-doctor-card:hover .fef-dt-doctor-photo img{border-color:var(--fdt-secondary)}
.fef-dt-doctor-nophoto{width:140px;height:140px;border-radius:12px;background:linear-gradient(135deg,#f0fdfa,#e0f2fe);display:flex;align-items:center;justify-content:center;font-size:40px;color:#0e7490}
.fef-dt-doctor-info{flex:1;min-width:0}
.fef-dt-doctor-info h3{margin:0 0 3px;font-size:20px;font-weight:600}
.fef-dt-doctor-info h3 a{color:#0e7490;text-decoration:none}
.fef-dt-doctor-info h3 a:hover{text-decoration:underline}
.fef-dt-doctor-spec{font-size:14px;color:#6b7280;margin-bottom:2px}
.fef-dt-doctor-exp{font-size:13px;color:#9ca3af;margin-bottom:8px;display:flex;align-items:center;gap:5px}
.fef-dt-doctor-exp i{color:#0e7490;font-size:12px}
.fef-dt-doctor-loc{font-size:13px;color:#374151;padding:6px 0;border-top:1px dashed #e5e7eb;border-bottom:1px dashed #e5e7eb;margin:6px 0;display:flex;align-items:center;gap:5px}
.fef-dt-doctor-loc i{color:#0e7490;font-size:12px}
.fef-dt-doctor-fee{font-size:13px;color:#6b7280;margin-bottom:8px;display:flex;align-items:center;gap:5px}
.fef-dt-doctor-fee i{color:#059669;font-size:11px}
.fef-dt-rating-pill{background:#16a34a;color:#fff;font-size:12px;font-weight:700;padding:4px 12px;border-radius:4px;display:inline-flex;align-items:center;gap:4px}
.fef-dt-doctor-rating{display:flex;align-items:center;gap:12px;margin-top:8px}
.fef-dt-doctor-rating a{color:#0e7490;font-size:13px;text-decoration:underline}
.fef-dt-doctor-extra{font-size:12px;color:#6b7280;margin-top:3px;display:flex;align-items:center;gap:4px}
.fef-dt-doctor-extra i{width:14px;color:#94a3b8;text-align:center}
.fef-dt-doctor-right{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end;gap:8px;min-width:200px}
.fef-dt-doctor-avail{color:#0e7490;font-size:13px;font-weight:600;display:flex;align-items:center;gap:5px}
.fef-dt-doctor-cta{display:block;background:#00bcd4;color:#fff;text-align:center;padding:12px 28px;border-radius:6px;font-size:14px;font-weight:700;text-decoration:none;min-width:200px;transition:all .2s;line-height:1.3}
.fef-dt-doctor-cta small{display:block;font-size:11px;font-weight:400;opacity:.9}
.fef-dt-doctor-cta:hover{background:#0097a7;color:#fff;box-shadow:0 4px 16px rgba(0,188,212,.3);transform:translateY(-1px)}
.fef-dt-doctor-contact{display:block;border:1px solid #d1d5db;color:#374151;text-align:center;padding:9px 28px;border-radius:6px;font-size:13px;font-weight:600;text-decoration:none;min-width:200px;transition:all .15s}
.fef-dt-doctor-contact:hover{border-color:#0e7490;color:#0e7490}
.fef-dt-doctor-contact i{margin-right:4px}
/* Slots */
.fef-dt-doctor-slots{padding:16px 28px 12px 180px;border-top:1px solid #f3f4f6}
.fef-dt-slots-tabs{display:flex;gap:0;border-bottom:2px solid #e5e7eb;margin-bottom:14px}
.fef-dt-slot-tab{padding:10px 28px;font-size:14px;color:#6b7280;cursor:pointer;text-align:center;position:relative;background:none;border:none;font-weight:500}
.fef-dt-slot-tab.active{color:#0e7490;font-weight:700}
.fef-dt-slot-tab.active::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#0e7490;border-radius:2px 2px 0 0}
.fef-dt-slot-count{display:block;font-size:11px;color:#0e7490;font-weight:600}
.fef-dt-slots-grid{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:4px}
.fef-dt-slot-pill{padding:7px 18px;border:1px solid #d1d5db;border-radius:20px;background:#fff;font-size:13px;color:#0e7490;cursor:pointer;transition:all .15s;font-weight:500}
.fef-dt-slot-pill:hover,.fef-dt-slot-pill.active{border-color:#0e7490;background:#e0f7fa;color:#0e7490;font-weight:600}

/* ════════════════════════════════════════════════════════════
   VEHICLE / PROPERTY TEMPLATE (OLX/Cars24-style)
   ════════════════════════════════════════════════════════════ */
.fef-dt-cards-vehicle,.fef-dt-cards-property{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--fdt-card-gap,16px)}
.fef-dt-vehicle-card{background:var(--fdt-card-bg);border-radius:var(--fdt-rad);border:1px solid var(--fdt-border);overflow:hidden;transition:all .25s;box-shadow:var(--fdt-card-shadow)}
.fef-dt-vehicle-card:hover{box-shadow:var(--fdt-card-hover);transform:translateY(-3px)}
.fef-dt-vehicle-img{position:relative;aspect-ratio:var(--fdt-card-ratio,16/10);overflow:hidden;background:#f3f4f6}
.fef-dt-vehicle-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.fef-dt-vehicle-img:hover img{transform:scale(1.08)}
.fef-dt-vehicle-badge{position:absolute;top:10px;left:10px;padding:5px 14px;border-radius:4px;font-size:11px;font-weight:700;color:#fff;background:#0d9488;letter-spacing:.3px}
.fef-dt-vehicle-img-count{position:absolute;bottom:10px;right:10px;background:rgba(0,0,0,.65);color:#fff;padding:3px 10px;border-radius:4px;font-size:11px;display:flex;align-items:center;gap:4px}
.fef-dt-vehicle-body{padding:16px 18px}
.fef-dt-vehicle-body h4{margin:0 0 6px;font-size:var(--fdt-card-title,16px);font-weight:700}
.fef-dt-vehicle-body h4 a{color:#1f2937;text-decoration:none}
.fef-dt-vehicle-body h4 a:hover{color:var(--fdt-primary)}
.fef-dt-vehicle-specs{display:flex;gap:4px;flex-wrap:wrap;font-size:12px;color:#6b7280;margin-bottom:10px}
.fef-dt-vehicle-specs span{display:inline-flex;align-items:center;gap:3px}
.fef-dt-vehicle-specs span::after{content:'|';margin-left:6px;color:#d1d5db}
.fef-dt-vehicle-specs span:last-child::after{display:none}
.fef-dt-vehicle-specs i{font-size:11px;color:#94a3b8}
.fef-dt-vehicle-price{font-size:24px;font-weight:800;color:#1f2937;margin-bottom:4px;display:flex;align-items:baseline;gap:2px}
.fef-dt-rupee{color:var(--fdt-primary);font-size:18px;font-weight:600}
.fef-dt-vehicle-emi{font-size:12px;color:#9ca3af;margin-bottom:12px}
.fef-dt-vehicle-meta{font-size:12px;color:#6b7280;margin-bottom:4px;display:flex;align-items:center;gap:5px}
.fef-dt-vehicle-meta i{width:14px;text-align:center;color:#94a3b8}
.fef-dt-vehicle-cta-row{display:flex;gap:10px;align-items:center;margin:12px 0 8px}
.fef-dt-vehicle-cta-main{flex:1;display:block;background:#dc2626;color:#fff;text-align:center;padding:11px;border-radius:6px;font-size:14px;font-weight:700;text-decoration:none;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:6px}
.fef-dt-vehicle-cta-main:hover{background:#b91c1c;color:#fff;box-shadow:0 4px 12px rgba(220,38,38,.25)}
.fef-dt-vehicle-offer{color:#f97316;font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap}
.fef-dt-vehicle-offer:hover{text-decoration:underline}
.fef-dt-vehicle-variant{font-size:12px;color:#6b7280;padding-top:8px;border-top:1px solid #f3f4f6}

/* ════════════════════════════════════════════════════════════
   JOB LISTING TEMPLATE (Naukri-style)
   ════════════════════════════════════════════════════════════ */
.fef-dt-tpl-jobs{display:flex;flex-direction:column;gap:12px}
.fef-dt-job-card{background:var(--fdt-card-bg);border-radius:var(--fdt-rad);border:1px solid var(--fdt-border);padding:20px 24px;transition:all .2s;box-shadow:var(--fdt-card-shadow)}
.fef-dt-job-card:hover{border-color:var(--fdt-primary);box-shadow:var(--fdt-card-hover)}
.fef-dt-job-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:8px}
.fef-dt-job-info{flex:1;min-width:0}
.fef-dt-job-info h3{margin:0 0 4px;font-size:18px;font-weight:700}
.fef-dt-job-info h3 a{color:#1e293b;text-decoration:none}
.fef-dt-job-info h3 a:hover{color:var(--fdt-primary)}
.fef-dt-job-logo{flex-shrink:0;width:56px;height:56px}
.fef-dt-job-logo img{width:56px;height:56px;object-fit:contain;border-radius:10px;border:1px solid #e5e7eb}
.fef-dt-job-company{font-size:13px;color:#475569;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.fef-dt-job-company-name{font-weight:500}
.fef-dt-job-star{color:#f59e0b;font-size:12px;font-weight:600}
.fef-dt-job-rev{color:#94a3b8;font-size:12px}
.fef-dt-job-details{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:#6b7280;margin-bottom:8px;padding:8px 0;border-bottom:1px dashed #f1f5f9}
.fef-dt-job-details span{display:flex;align-items:center;gap:4px}
.fef-dt-job-details i{font-size:12px;color:#94a3b8}
.fef-dt-job-type-badge{background:#eff6ff;color:#1d4ed8;padding:2px 10px;border-radius:4px;font-size:11px;font-weight:600}
.fef-dt-job-desc{font-size:12px;color:#64748b;margin-bottom:10px;display:flex;align-items:flex-start;gap:6px;line-height:1.5}
.fef-dt-job-desc i{color:#94a3b8;margin-top:2px;flex-shrink:0}
.fef-dt-job-skills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.fef-dt-job-skill{padding:3px 12px;background:#f1f5f9;color:#475569;border-radius:14px;font-size:11px;white-space:nowrap;transition:all .15s}
.fef-dt-job-skill:hover{background:var(--fdt-primary);color:#fff}
.fef-dt-job-extra{font-size:12px;color:#6b7280;margin-bottom:4px;display:flex;align-items:center;gap:5px}
.fef-dt-job-extra i{width:14px;text-align:center;color:#94a3b8}
.fef-dt-job-footer{display:flex;align-items:center;justify-content:space-between;padding-top:10px;border-top:1px solid #f1f5f9}
.fef-dt-job-ago{font-size:12px;color:#0ea5e9;display:flex;align-items:center;gap:4px}
.fef-dt-job-ago i{font-size:11px}
.fef-dt-job-footer-acts{display:flex;align-items:center;gap:4px}

/* ════════════════════════════════════════════════════════════
   VIDEO GALLERY TEMPLATE (YouTube-style)
   ════════════════════════════════════════════════════════════ */
.fef-dt-cards-video_gallery{display:grid;grid-template-columns:repeat(var(--fdt-grid-cols,3),1fr);gap:var(--fdt-card-gap,16px)}
.fef-dt-video-card{transition:all .2s}
.fef-dt-video-card:hover{transform:translateY(-2px)}
.fef-dt-video-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:#0f0f0f;cursor:pointer;border-radius:var(--fdt-rad)}
.fef-dt-video-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.fef-dt-video-thumb:hover img{transform:scale(1.05)}
.fef-dt-video-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}
.fef-dt-video-thumb:hover .fef-dt-video-play{opacity:1}
.fef-dt-video-play i{width:52px;height:52px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.75);color:#fff;border-radius:50%;font-size:18px;padding-left:3px;backdrop-filter:blur(4px)}
.fef-dt-video-duration{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.85);color:#fff;font-size:11px;font-weight:600;padding:2px 7px;border-radius:3px;letter-spacing:.3px}
.fef-dt-video-info{padding:10px 2px}
.fef-dt-video-info h4{margin:0 0 4px;font-size:14px;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fef-dt-video-info h4 a{color:#0f0f0f;text-decoration:none}
.fef-dt-video-info h4 a:hover{color:var(--fdt-primary)}
.fef-dt-video-channel{font-size:12px;color:#606060;margin-bottom:2px}
.fef-dt-video-stats{font-size:12px;color:#606060}
.fef-dt-video-stats span::after{content:' · '}
.fef-dt-video-stats span:last-child::after{display:none}
.fef-dt-video-player-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:9999999;align-items:center;justify-content:center;padding:20px}
.fef-dt-video-player-overlay.active{display:flex}
.fef-dt-video-player-wrap{position:relative;width:80vw;max-width:1000px;aspect-ratio:16/9}
.fef-dt-video-player-wrap iframe{width:100%;height:100%;border-radius:8px}
.fef-dt-video-player-close{position:absolute;top:-40px;right:0;background:none;border:none;color:#fff;font-size:30px;cursor:pointer}

/* ════════════════════════════════════════════════════════════
   PRICELIST TEMPLATE (with images, ₹ pricing)
   ════════════════════════════════════════════════════════════ */
.fef-dt-pricelist{background:#fff;border-radius:var(--fdt-rad);overflow:hidden;border:1px solid var(--fdt-border)}
.fef-dt-pricelist-alpha{display:flex;flex-wrap:wrap;gap:4px;padding:14px 18px;background:linear-gradient(135deg,#f0fdf4,#ecfdf5);border-bottom:1px solid #d1fae5}
.fef-dt-alpha-btn{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border:1px solid #d1d5db;border-radius:6px;font-size:12px;color:#374151;cursor:pointer;transition:all .15s;background:#fff;font-weight:500}
.fef-dt-alpha-btn:hover,.fef-dt-alpha-btn.active{background:#16a34a;color:#fff;border-color:#16a34a;transform:scale(1.05)}
.fef-dt-pricelist-table{border:none}
.fef-dt-pricelist-table thead{background:linear-gradient(135deg,#fef3c7,#fde68a)}
.fef-dt-pricelist-table th{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#78716c;padding:16px 20px;border-bottom:2px solid #d4a574}
.fef-dt-pricelist-table td{padding:14px 20px;font-size:14px;color:#374151;border-bottom:1px solid #f3f4f6;vertical-align:middle}
.fef-dt-pricelist-table tbody tr:nth-child(even){background:#fefbf3}
.fef-dt-pricelist-table tbody tr:hover{background:#fef3c7}
.fef-dt-pricelist-table td a{color:#16a34a;font-weight:600;text-decoration:none;font-size:15px}
.fef-dt-pricelist-table td a:hover{text-decoration:underline}
.fef-dt-pricelist-table .fef-dt-cell-img{width:50px;height:50px;border-radius:8px}

/* ════════════════════════════════════════════════════════════
   BOOKING / CALENDAR TEMPLATE (Google Calendar-style)
   ════════════════════════════════════════════════════════════ */
.fef-dt-booking{background:#fff;border-radius:var(--fdt-rad);border:1px solid var(--fdt-border);overflow:hidden}
.fef-dt-book-step{padding:24px 28px;border-bottom:1px solid #f1f5f9;display:none}
.fef-dt-book-step.active{display:block}
.fef-dt-book-step-1{display:block}
.fef-dt-book-step-header{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.fef-dt-book-step-num{width:32px;height:32px;border-radius:50%;background:var(--fdt-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}
.fef-dt-book-step-header h3{margin:0;font-size:18px;font-weight:600;color:#1e293b}
.fef-dt-cal-layout{display:flex;gap:28px;min-height:300px}
.fef-dt-cal-month{flex-shrink:0;width:280px}
.fef-dt-cal-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.fef-dt-cal-nav span{font-size:16px;font-weight:600;color:#1e293b}
.fef-dt-cal-nav button{background:none;border:1px solid #e5e7eb;font-size:18px;color:#5f6368;cursor:pointer;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .15s}
.fef-dt-cal-nav button:hover{background:#f1f3f4;border-color:#c0c4cc}
.fef-dt-cal-grid{user-select:none}
.fef-dt-cal-dow{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:11px;font-weight:600;color:#70757a;margin-bottom:6px}
/* Calendar day grid populated dynamically */
[id$="_cdays"]{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.fef-dt-cal-day,.fef-dt-cal-empty{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:13px;cursor:pointer;color:#3c4043;transition:all .15s}
.fef-dt-cal-day:hover:not(.past){background:#e8f0fe}
.fef-dt-cal-empty{cursor:default}
.fef-dt-cal-day.today{color:#1a73e8;font-weight:700;background:#e8f0fe}
.fef-dt-cal-day.sel{background:#1a73e8!important;color:#fff!important;font-weight:700;box-shadow:0 2px 8px rgba(26,115,232,.3)}
.fef-dt-cal-day.past{color:#cbd5e1;cursor:default}
.fef-dt-cal-selected{flex:1;border-left:1px solid #e8eaed;padding-left:28px;display:flex;align-items:center;justify-content:center}
.fef-dt-cal-sel-msg{text-align:center;color:#94a3b8;font-size:14px;display:flex;flex-direction:column;align-items:center;gap:8px}
.fef-dt-cal-sel-date{font-size:16px;color:#1e293b;font-weight:600;display:flex;align-items:center;gap:8px}
/* Slots in booking step 2 */
.fef-dt-book-slots{display:flex;gap:20px;flex-wrap:wrap}
.fef-dt-slots-morning,.fef-dt-slots-afternoon{flex:1;min-width:180px}
.fef-dt-slots-morning h5,.fef-dt-slots-afternoon h5{font-size:13px;font-weight:600;color:#6b7280;margin:0 0 10px;display:flex;align-items:center;gap:6px}
.fef-dt-slots-morning h5 i{color:#f59e0b}
.fef-dt-slots-afternoon h5 i{color:#f97316}
.fef-dt-book-slots .fef-dt-slots-grid{display:flex;flex-wrap:wrap;gap:8px}
.fef-dt-book-slots .fef-dt-slot-pill{padding:8px 18px;border:1px solid #d1d5db;border-radius:22px;background:#fff;font-size:13px;color:#1a73e8;cursor:pointer;transition:all .15s;font-weight:500}
.fef-dt-book-slots .fef-dt-slot-pill:hover{border-color:#1a73e8;background:#e8f0fe}
.fef-dt-book-slots .fef-dt-slot-pill.active{background:#1a73e8;color:#fff;border-color:#1a73e8;box-shadow:0 2px 8px rgba(26,115,232,.25)}
/* Summary */
.fef-dt-book-summary-inner{display:flex;gap:24px;align-items:center;justify-content:center;padding:16px;background:#f0f9ff;border-radius:10px;margin-bottom:16px;font-size:15px;color:#1e293b}
.fef-dt-book-summary-inner i{color:var(--fdt-primary);margin-right:4px}
.fef-dt-book-action{display:flex;align-items:center;gap:12px;justify-content:center}
.fef-dt-book-qty{display:flex;align-items:center;gap:8px}
.fef-dt-book-qty label{font-size:13px;color:#6b7280}
.fef-dt-book-submit{font-size:16px;padding:12px 36px}
/* Booking items */
.fef-dt-book-items{padding:0 28px 20px}
.fef-dt-book-items h4{font-size:15px;color:#1e293b;margin:20px 0 12px;display:flex;align-items:center;gap:6px}
.fef-dt-book-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #f3f4f6}
.fef-dt-book-item:last-child{border-bottom:none}
.fef-dt-book-item-bar{width:5px;height:36px;border-radius:3px;flex-shrink:0}
.fef-dt-book-st-confirmed .fef-dt-book-item-bar,.fef-dt-book-st-publish .fef-dt-book-item-bar{background:#4ade80}
.fef-dt-book-st-pending .fef-dt-book-item-bar{background:#facc15}
.fef-dt-book-st-cancelled .fef-dt-book-item-bar,.fef-dt-book-st-draft .fef-dt-book-item-bar{background:#f87171}
.fef-dt-book-item-info{flex:1;display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;font-size:13px}
.fef-dt-book-item-info strong a{color:#1e293b;text-decoration:none}
.fef-dt-book-item-info strong a:hover{color:var(--fdt-primary)}
.fef-dt-book-item-badge{padding:2px 10px;border-radius:12px;font-size:11px;font-weight:600;background:#f1f5f9;color:#475569;text-transform:capitalize}

/* ════════════════════════════════════════════════════════════
   EDUCATION / INSTITUTE TEMPLATE
   ════════════════════════════════════════════════════════════ */
.fef-dt-cards-edu{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--fdt-card-gap,16px)}
.fef-dt-edu-card{background:var(--fdt-card-bg);border-radius:var(--fdt-rad);border:1px solid var(--fdt-border);overflow:hidden;transition:all .2s;box-shadow:var(--fdt-card-shadow)}
.fef-dt-edu-card:hover{box-shadow:var(--fdt-card-hover);transform:translateY(-2px)}
.fef-dt-edu-img{aspect-ratio:16/9;overflow:hidden;background:#f3f4f6}
.fef-dt-edu-img img{width:100%;height:100%;object-fit:cover}
.fef-dt-edu-body{padding:16px}
.fef-dt-edu-body h4{margin:0 0 6px;font-size:var(--fdt-card-title,16px);font-weight:700}
.fef-dt-edu-body h4 a{color:#1e293b;text-decoration:none}
.fef-dt-edu-body h4 a:hover{color:var(--fdt-primary)}
.fef-dt-edu-rating{color:#f59e0b;font-size:13px;font-weight:600;margin-left:6px}
.fef-dt-edu-meta{font-size:13px;color:#6b7280;margin-top:4px;display:flex;align-items:center;gap:6px}
.fef-dt-edu-meta i{width:14px;text-align:center;color:var(--fdt-primary);font-size:12px}

/* ════════════════════════════════════════════════════════════
   GENERIC CARD LAYOUTS (grid, box, photo_gallery)
   ════════════════════════════════════════════════════════════ */
.fef-dt-cards{display:grid;gap:var(--fdt-card-gap,16px)}
.fef-dt-cards-grid,.fef-dt-cards-box_heading,.fef-dt-cards-box_overlay,.fef-dt-cards-photo_gallery{grid-template-columns:repeat(var(--fdt-grid-cols,3),1fr)}
.fef-dt-card{background:var(--fdt-card-bg);border-radius:var(--fdt-rad);border:1px solid var(--fdt-border);overflow:hidden;transition:all .25s;display:flex;flex-direction:column;box-shadow:var(--fdt-card-shadow)}
.fef-dt-card:hover{box-shadow:var(--fdt-card-hover);transform:translateY(-2px)}
.fef-dt-card-img{position:relative;aspect-ratio:var(--fdt-card-ratio,16/10);overflow:hidden;background:#f3f4f6}
.fef-dt-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.fef-dt-card-img:hover img{transform:scale(1.05)}
.fef-dt-card-no-img{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#cbd5e1;font-size:32px}
.fef-dt-card-badge{position:absolute;top:8px;right:8px}
.fef-dt-card-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,rgba(0,0,0,.7));padding:16px;color:#fff}
.fef-dt-card-overlay h4{margin:0;font-size:16px}
.fef-dt-card-overlay h4 a{color:#fff;text-decoration:none}
.fef-dt-card-body{padding:14px 16px;flex:1}
.fef-dt-card-title{margin:4px 0 8px;font-size:var(--fdt-card-title,15px)}
.fef-dt-card-title a{color:#0f172a;text-decoration:none}
.fef-dt-card-title a:hover{color:var(--fdt-primary)}
.fef-dt-card-excerpt{font-size:12px;color:#64748b;margin:0 0 8px;line-height:1.5}
.fef-dt-card-meta{font-size:12px;color:#475569;margin-bottom:3px;display:flex;align-items:center;gap:4px}
.fef-dt-card-meta i{color:#94a3b8;font-size:11px;width:14px;text-align:center}
.fef-dt-card-meta-label{font-weight:600;color:#334155}
.fef-dt-card-date{font-size:11px;color:#94a3b8;margin-top:6px;display:flex;align-items:center;gap:4px}
.fef-dt-card-footer{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-top:1px solid #f1f5f9;gap:8px}
.fef-dt-cards-photo_gallery .fef-dt-card-img{aspect-ratio:1}

/* ── RESPONSIVE ── */
@media(max-width:768px){
.fef-dt-toolbar{flex-direction:column;align-items:stretch}
.fef-dt-toolbar-l,.fef-dt-toolbar-r{justify-content:space-between}
.fef-dt-search-inp,.fef-dt-search-inp:focus{width:100%!important}
.fef-dt-qv-fields{grid-template-columns:1fr}
.fef-dt-qv-header{flex-direction:column}
.fef-dt-exp-inner{grid-template-columns:1fr}
.fef-dt-cards-grid,.fef-dt-cards-box_heading,.fef-dt-cards-box_overlay,.fef-dt-cards-photo_gallery,.fef-dt-cards-video_gallery{grid-template-columns:repeat(2,1fr)}
.fef-dt-cards-vehicle,.fef-dt-cards-property,.fef-dt-cards-edu{grid-template-columns:1fr}
.fef-dt-doctor-row{flex-direction:column}
.fef-dt-doctor-photo{width:80px}.fef-dt-doctor-photo img{width:80px;height:80px}
.fef-dt-doctor-right{flex-direction:row;flex-wrap:wrap;min-width:auto;width:100%}
.fef-dt-doctor-cta,.fef-dt-doctor-contact{min-width:auto;flex:1}
.fef-dt-doctor-slots{padding-left:28px}
.fef-dt-job-header{flex-direction:column}
.fef-dt-cal-layout{flex-direction:column}
.fef-dt-cal-selected{border-left:none;padding-left:0;border-top:1px solid #e8eaed;padding-top:16px}
}
@media(max-width:480px){
.fef-dt-cards-grid,.fef-dt-cards-box_heading,.fef-dt-cards-box_overlay,.fef-dt-cards-photo_gallery,.fef-dt-cards-video_gallery{grid-template-columns:1fr}
.fef-dt-qv-modal{max-width:100%;margin:10px;max-height:90vh}
.fef-dt-pagination{flex-direction:column;text-align:center}
.fef-dt-doctor-slots{padding-left:12px}
.fef-dt-book-summary-inner{flex-direction:column;gap:8px}
}

/* ════════════════════════════════════════════════════════════
   JETENGINE LISTING INTEGRATION
   ════════════════════════════════════════════════════════════ */
.fef-dt-je-grid{width:100%}
.fef-dt-je-item{background:var(--fdt-card-bg,#fff);border-radius:var(--fdt-rad,8px);border:1px solid var(--fdt-border,#e2e8f0);overflow:hidden;transition:all .25s;box-shadow:var(--fdt-card-shadow,0 1px 3px rgba(0,0,0,.08))}
.fef-dt-je-item:hover{box-shadow:var(--fdt-card-hover,0 8px 25px rgba(0,0,0,.12));transform:translateY(-2px)}
.fef-dt-je-actions{background:var(--fdt-card-bg,#fff)}
/* Action Buttons shortcode/widget wrapper */
.fef-ab-wrap{flex-wrap:wrap}
.fef-ab-wrap .fef-dt-act{transition:all .15s}
.fef-ab-elementor-wrap .fef-ab-wrap{gap:var(--fef-ab-gap,2px)}
@media(max-width:768px){.fef-dt-je-grid{grid-template-columns:repeat(2,1fr)!important}.fef-ab-wrap{justify-content:center!important}}
@media(max-width:480px){.fef-dt-je-grid{grid-template-columns:1fr!important}}

/* JetEngine Listing — Header & List Layout */
.fef-dt-je-header{overflow-x:auto}
.fef-dt-je-th{flex-shrink:0;border-right:1px solid rgba(0,0,0,.05)}
.fef-dt-je-th:last-child{border-right:none}
.fef-dt-je-th .fef-dt-sort-link:hover{color:var(--fdt-primary,#4f46e5)!important}
.fef-dt-je-list{background:var(--fdt-card-bg,#fff)}
.fef-dt-je-row{transition:background .15s}
.fef-dt-je-row:hover{background:var(--fdt-hover,#f1f5f9)}
.fef-dt-je-row:last-child{border-bottom:none!important}
.fef-dt-tpl-jetengine.fef-dt-striped .fef-dt-je-row:nth-child(even){background:var(--fdt-stripe,#f8fafc)}
.fef-dt-tpl-jetengine.fef-dt-striped .fef-dt-je-row:nth-child(even):hover{background:var(--fdt-hover,#f1f5f9)}
.fef-dt-je-grid .fef-dt-je-item{background:var(--fdt-card-bg,#fff);border-radius:var(--fdt-rad,8px);border:1px solid var(--fdt-border,#e2e8f0);overflow:hidden;transition:all .25s;box-shadow:var(--fdt-card-shadow,0 1px 3px rgba(0,0,0,.08))}
.fef-dt-je-grid .fef-dt-je-item:hover{box-shadow:var(--fdt-card-hover,0 8px 25px rgba(0,0,0,.12));transform:translateY(-2px)}
@media(max-width:768px){
.fef-dt-je-header{overflow-x:auto;-webkit-overflow-scrolling:touch}
.fef-dt-je-grid{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:480px){.fef-dt-je-grid{grid-template-columns:1fr!important}}
/* ================================================================
 * BRANCH REPEATER — ACCORDION EXPAND / COLLAPSE
 * ================================================================*/
.fef-branch-accordion-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px 6px;
    color: #9ca3af;
    font-size: 12px;
    transition: transform 0.25s ease;
    flex-shrink: 0;
    line-height: 1;
    margin-right: 4px;
}
.fef-branch-accordion-toggle:hover {
    color: #374151;
}
.fef-branch-accordion-closed .fef-branch-accordion-toggle i {
    transform: rotate(-90deg);
}
.fef-branch-header-clickable {
    cursor: pointer;
    user-select: none;
}
.fef-branch-header-clickable:hover {
    background: #f8fafc;
    border-radius: 4px;
}
/* Hide fields body when branch item is collapsed */
.fef-repeater-item.fef-branch-accordion-closed > .fef-branch-fields-body {
    display: none !important;
}
/* Remove bottom border on header when collapsed */
.fef-repeater-item.fef-branch-accordion-closed > .fef-repeater-item-header {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}