/** * Ludicity Frontend Editor - Styles * Centralized CSS: no inline styles in PHP template */ /* Conteneur principal */ div#ludicity-frontend-editor .ludicity-frontend-editor-wrapper, div#ludicity-frontend-editor-dialog .ludicity-frontend-editor-wrapper { min-height: 60vh; } /* ══════════════════════════════════════════════════════════════════════════ * NE PAS SUPPRIMER — RÈGLE CRITIQUE * ══════════════════════════════════════════════════════════════════════════ * Toutes les boîtes de dialogue (wp.media, LudicityDialog, date/time/gps * picker, overlays de chargement, plupload wrapper) sont insérées dans * #ludicity-frontend-editor-dialog, créé à la volée comme ENFANT DIRECT * de par window.ludicityGetDialogRoot() (voir LudicityDialog.js, * ludicity-frontend-editor-init.js, LudicityDateUI.js, LudicityGpsUIMultiple.js). * * Cette racine dédiée au dialogue vit au niveau du body pour échapper à tout * stacking context restrictif créé par les ancêtres du thème (header fixe, * wrappers avec transform/filter/isolation, etc.). C'est la seule manière * fiable de garantir que les dialogues passent AU-DESSUS du header. * * Le container principal #ludicity-frontend-editor conserve également son * stacking context élevé au cas où certains dialogues y resteraient attachés * (rétrocompatibilité). Tous les sélecteurs de ce fichier sont systémati- * quement dupliqués pour #ludicity-frontend-editor ET pour * #ludicity-frontend-editor-dialog afin que les styles s'appliquent * identiquement aux deux emplacements. * * Retirer `position: relative` ou `z-index` ici casserait l'affichage de * toutes les modales du plugin côté front-end. * ══════════════════════════════════════════════════════════════════════════ */ div#ludicity-frontend-editor, div#ludicity-frontend-editor-dialog { position: relative; z-index: 20000; } /* Le dialog root est un pur conteneur de positionnement ajouté en fin de . Vide, il doit avoir une empreinte nulle dans le flux, sinon il ajoute une hauteur blanche en bas de la page. `overflow: visible` garantit que ses enfants absolus (popups date/heure, overlays) restent affichés. */ div#ludicity-frontend-editor-dialog { height: 0; overflow: visible; } /* Sécurité : z-index explicite sur les éléments de dialogue déplacés. */ div#ludicity-frontend-editor > .media-modal, div#ludicity-frontend-editor-dialog > .media-modal, div#ludicity-frontend-editor > .media-modal-backdrop, div#ludicity-frontend-editor-dialog > .media-modal-backdrop, div#ludicity-frontend-editor > [id^="__wp-uploader-id-"], div#ludicity-frontend-editor-dialog > [id^="__wp-uploader-id-"], div#ludicity-frontend-editor > #ludicity-dialog-overlay, div#ludicity-frontend-editor-dialog > #ludicity-dialog-overlay, div#ludicity-frontend-editor > #editor-loading-overlay, div#ludicity-frontend-editor-dialog > #editor-loading-overlay, div#ludicity-frontend-editor > #save-loading-overlay, div#ludicity-frontend-editor-dialog > #save-loading-overlay, div#ludicity-frontend-editor > .ludicity-gps-modal, div#ludicity-frontend-editor-dialog > .ludicity-gps-modal, div#ludicity-frontend-editor > .ludicity-timepicker-modal, div#ludicity-frontend-editor-dialog > .ludicity-timepicker-modal, div#ludicity-frontend-editor > .ludicity-datepicker-modal, div#ludicity-frontend-editor-dialog > .ludicity-datepicker-modal { z-index: 100010; } /* Login Required */ div#ludicity-frontend-editor .ludicity-login-required, div#ludicity-frontend-editor-dialog .ludicity-login-required { max-width: 400px; margin: 40px auto; padding: 30px; border: 1px solid #ddd; border-radius: 8px; background: #fff; text-align: center; } div#ludicity-frontend-editor .ludicity-login-required .llr-panel-title, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-panel-title { margin-bottom: 20px; font-size: 16px; } div#ludicity-frontend-editor .ludicity-login-required .llr-panel-title strong, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-panel-title strong { font-weight: 600; } div#ludicity-frontend-editor .ludicity-login-required .llr-message, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-message { margin: 0 0 12px; padding: 10px; border-radius: 6px; font-size: 13px; display: none; } div#ludicity-frontend-editor .ludicity-login-required .llr-link-group, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-link-group { margin-top: 15px; font-size: 13px; } div#ludicity-frontend-editor .ludicity-login-required .llr-link-group-alt, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-link-group-alt { margin-top: 10px; font-size: 13px; } div#ludicity-frontend-editor .ludicity-login-required .llr-panel-hidden, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-panel-hidden { display: none !important; } /* Forgot password panel */ div#ludicity-frontend-editor .ludicity-login-required .llr-forgot-title, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-forgot-title { margin-bottom: 20px; font-size: 16px; font-weight: 600; } div#ludicity-frontend-editor .ludicity-login-required .llr-forgot-desc, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-forgot-desc { margin-bottom: 20px; font-size: 13px; color: #555; } div#ludicity-frontend-editor .ludicity-login-required .llr-form-label, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-form-label { display: block; text-align: left; margin-bottom: 4px; font-size: 13px; font-weight: 600; } div#ludicity-frontend-editor .ludicity-login-required .llr-form-input, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-form-input { width: 100%; padding: 8px 12px; border: 1px solid #ddd; border-radius: 6px; box-sizing: border-box; font-size: 14px; } div#ludicity-frontend-editor .ludicity-login-required .llr-pass-wrap, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-pass-wrap { position: relative; display: block; } div#ludicity-frontend-editor .ludicity-login-required .llr-pass-wrap .llr-form-input, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-pass-wrap .llr-form-input { padding-right: 36px; } div#ludicity-frontend-editor .ludicity-login-required .llr-toggle-pass, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-toggle-pass { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); background: none; border: none; padding: 0; cursor: pointer; color: #888; display: flex; align-items: center; line-height: 1; } div#ludicity-frontend-editor .ludicity-login-required .llr-toggle-pass:hover, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-toggle-pass:hover { color: #333; } div#ludicity-frontend-editor .ludicity-login-required .llr-button-group, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-button-group { margin-top: 15px; display: flex; gap: 10px; justify-content: center; } div#ludicity-frontend-editor .ludicity-login-required .llr-back-button, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-back-button { padding: 9px 20px; background: transparent; color: #555; border: 1px solid #ddd; border-radius: 3px; cursor: pointer; font-size: 13px; } /* Reset password panel */ div#ludicity-frontend-editor .ludicity-login-required .llr-resetpass-title, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-resetpass-title { margin-bottom: 20px; font-size: 16px; font-weight: 600; } div#ludicity-frontend-editor .ludicity-login-required .llr-resetpass-desc, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-resetpass-desc { margin-bottom: 20px; font-size: 13px; color: #555; } div#ludicity-frontend-editor .ludicity-login-required .llr-pass-strength-result, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-pass-strength-result { display: none; margin: 6px 0 10px; padding: 6px 10px; border-radius: 4px; font-size: 13px; text-align: left; } div#ludicity-frontend-editor .ludicity-login-required .llr-submit-group, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-submit-group { margin-top: 15px; } div#ludicity-frontend-editor .ludicity-login-required .llr-invalid-title, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-invalid-title { font-size: 16px; font-weight: 600; margin-bottom: 12px; } div#ludicity-frontend-editor .ludicity-login-required .llr-invalid-desc, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-invalid-desc { font-size: 13px; color: #555; margin-bottom: 20px; } div#ludicity-frontend-editor .ludicity-login-required .llr-inline-link, div#ludicity-frontend-editor-dialog .ludicity-login-required .llr-inline-link { display: inline-block; text-decoration: none; } /* No permission */ div#ludicity-frontend-editor .ludicity-no-permission, div#ludicity-frontend-editor-dialog .ludicity-no-permission { max-width: 400px; margin: 40px auto; padding: 30px; border: 1px solid #f5c6c6; border-radius: 8px; background: #fff8f8; text-align: center; } div#ludicity-frontend-editor .ludicity-no-permission .llr-no-perm-message, div#ludicity-frontend-editor-dialog .ludicity-no-permission .llr-no-perm-message { margin-bottom: 15px; font-size: 16px; } div#ludicity-frontend-editor .ludicity-no-permission .llr-logout-button, div#ludicity-frontend-editor-dialog .ludicity-no-permission .llr-logout-button { display: inline-flex; align-items: center; padding: 8px 20px; background: #c0392b; border: 1px solid #a93226; border-radius: 3px; color: #fff; text-decoration: none; cursor: pointer; white-space: nowrap; box-sizing: border-box; font-size: 13px; } /* ── Layout helpers ───────────────────────────────────────────────────────── */ div#ludicity-frontend-editor .lfe-hidden, div#ludicity-frontend-editor-dialog .lfe-hidden { display: none; } div#ludicity-frontend-editor .ludicity-fe-btn.lfe-hidden, div#ludicity-frontend-editor-dialog .ludicity-fe-btn.lfe-hidden, div#ludicity-frontend-editor .lfe-add-btn.lfe-hidden, div#ludicity-frontend-editor-dialog .lfe-add-btn.lfe-hidden, div#ludicity-frontend-editor .lfe-add-btn-sm.lfe-hidden, div#ludicity-frontend-editor-dialog .lfe-add-btn-sm.lfe-hidden, div#ludicity-frontend-editor .lfe-reset-when-btn.lfe-hidden, div#ludicity-frontend-editor-dialog .lfe-reset-when-btn.lfe-hidden { display: none; } div#ludicity-frontend-editor .lfe-flex-gap, div#ludicity-frontend-editor-dialog .lfe-flex-gap { display: flex; gap: 10px; } div#ludicity-frontend-editor .lfe-flex-center-gap, div#ludicity-frontend-editor-dialog .lfe-flex-center-gap { display: flex; align-items: center; gap: 10px; } div#ludicity-frontend-editor .lfe-flex-1, div#ludicity-frontend-editor-dialog .lfe-flex-1 { flex: 1; } div#ludicity-frontend-editor .lfe-flex-shrink-0, div#ludicity-frontend-editor-dialog .lfe-flex-shrink-0 { flex-shrink: 0; } div#ludicity-frontend-editor .lfe-flex-wrap-gap, div#ludicity-frontend-editor-dialog .lfe-flex-wrap-gap { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } div#ludicity-frontend-editor .lfe-save-buttons, div#ludicity-frontend-editor-dialog .lfe-save-buttons { display: flex; gap: 6px; align-items: center; } div#ludicity-frontend-editor .lfe-mt-15, div#ludicity-frontend-editor-dialog .lfe-mt-15 { margin-top: 15px; } div#ludicity-frontend-editor .lfe-mb-20, div#ludicity-frontend-editor-dialog .lfe-mb-20 { margin-bottom: 20px; } /* ── Profile section header ───────────────────────────────────────────────── */ div#ludicity-frontend-editor .lfe-profile-header, div#ludicity-frontend-editor-dialog .lfe-profile-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 0; gap: 10px; } div#ludicity-frontend-editor .lfe-section-title, div#ludicity-frontend-editor-dialog .lfe-section-title { margin: 0; font-size: 24px; color: #333; } div#ludicity-frontend-editor .lfe-section-subtitle, div#ludicity-frontend-editor-dialog .lfe-section-subtitle { margin: 4px 0 0 0; font-size: 13px; color: #666; } /* ── Logout modal ─────────────────────────────────────────────────────────── */ div#ludicity-frontend-editor .lfe-modal-overlay, div#ludicity-frontend-editor-dialog .lfe-modal-overlay { display: none; position: fixed; inset: 0; z-index: 99999; background: rgba(0,0,0,0.5); align-items: center; justify-content: center; } div#ludicity-frontend-editor .lfe-modal-overlay.visible, div#ludicity-frontend-editor-dialog .lfe-modal-overlay.visible { display: flex; } div#ludicity-frontend-editor .lfe-modal-box, div#ludicity-frontend-editor-dialog .lfe-modal-box { background: #fff; border-radius: 8px; padding: 30px; max-width: 360px; width: 90%; text-align: center; box-shadow: 0 10px 40px rgba(0,0,0,0.2); } div#ludicity-frontend-editor .lfe-modal-title, div#ludicity-frontend-editor-dialog .lfe-modal-title { font-size: 18px; font-weight: 600; margin: 0 0 10px; } div#ludicity-frontend-editor .lfe-modal-desc, div#ludicity-frontend-editor-dialog .lfe-modal-desc { color: #666; margin: 0 0 25px; } div#ludicity-frontend-editor .lfe-modal-actions, div#ludicity-frontend-editor-dialog .lfe-modal-actions { display: flex; gap: 10px; justify-content: center; } div#ludicity-frontend-editor .lfe-modal-btn, div#ludicity-frontend-editor-dialog .lfe-modal-btn { min-width: 100px; } /* ── Profile card ─────────────────────────────────────────────────────────── */ div#ludicity-frontend-editor .lfe-profile-card, div#ludicity-frontend-editor-dialog .lfe-profile-card { display: none; margin-bottom: 30px; padding: 20px; background: #fff; border: 1px solid #ddd; border-radius: 4px; margin-top: 15px; } div#ludicity-frontend-editor .lfe-profile-avatar, div#ludicity-frontend-editor-dialog .lfe-profile-avatar { width: 100px; height: 100px; flex-shrink: 0; border-radius: 4px; overflow: hidden; background: #f0f0f0; display: flex; align-items: center; justify-content: center; } div#ludicity-frontend-editor .lfe-avatar-img, div#ludicity-frontend-editor-dialog .lfe-avatar-img { display: none; width: 100%; height: 100%; object-fit: cover; } div#ludicity-frontend-editor .lfe-avatar-placeholder, div#ludicity-frontend-editor-dialog .lfe-avatar-placeholder { color: #999; font-size: 40px; } div#ludicity-frontend-editor .lfe-profile-name, div#ludicity-frontend-editor-dialog .lfe-profile-name { margin: 0 0 10px 0; font-size: 24px; font-weight: bold; } /* ── Editor controls ──────────────────────────────────────────────────────── */ div#ludicity-frontend-editor .lfe-editor-controls-top, div#ludicity-frontend-editor-dialog .lfe-editor-controls-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; } /* ── Featured image ───────────────────────────────────────────────────────── */ div#ludicity-frontend-editor .lfe-featured-image-container, div#ludicity-frontend-editor-dialog .lfe-featured-image-container { margin-bottom: 20px; width: 50%; } div#ludicity-frontend-editor .lfe-field-label, div#ludicity-frontend-editor-dialog .lfe-field-label { display: block; font-weight: bold; margin-bottom: 4px; font-size: 14px; } div#ludicity-frontend-editor .lfe-field-label-mt, div#ludicity-frontend-editor-dialog .lfe-field-label-mt { display: block; font-weight: bold; margin-top: 15px; margin-bottom: 4px; font-size: 14px; } div#ludicity-frontend-editor .lfe-field-sublabel, div#ludicity-frontend-editor-dialog .lfe-field-sublabel { margin: 0 0 10px 0; font-size: 13px; color: #666; display: none; } div#ludicity-frontend-editor .lfe-field-sublabel-sm, div#ludicity-frontend-editor-dialog .lfe-field-sublabel-sm { margin: 0 0 6px 0; font-size: 13px; color: #666; display: none; } div#ludicity-frontend-editor .lfe-featured-image-preview, div#ludicity-frontend-editor-dialog .lfe-featured-image-preview { width: 266px; height: 266px; border: 1px solid #ddd; display: flex; align-items: center; justify-content: center; background-color: #f0f0f0; position: relative; overflow: hidden; cursor: pointer; } div#ludicity-frontend-editor .lfe-featured-image-img, div#ludicity-frontend-editor-dialog .lfe-featured-image-img { display: none; width: 100%; height: 100%; object-fit: cover; } div#ludicity-frontend-editor .lfe-featured-image-placeholder, div#ludicity-frontend-editor-dialog .lfe-featured-image-placeholder { color: #999; text-align: center; padding: 10px; font-size: 14px; } div#ludicity-frontend-editor .lfe-featured-image-actions, div#ludicity-frontend-editor-dialog .lfe-featured-image-actions { display: none; position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.45); padding: 8px; justify-content: center; gap: 8px; } /* ── TinyMCE / textarea ───────────────────────────────────────────────────── */ div#ludicity-frontend-editor .lfe-tinymce-textarea, div#ludicity-frontend-editor-dialog .lfe-tinymce-textarea { width: 100%; height: 400px; } /* ── Metabox container ────────────────────────────────────────────────────── */ div#ludicity-frontend-editor .lfe-metabox-container, div#ludicity-frontend-editor-dialog .lfe-metabox-container { display: none; margin-top: 20px; padding: 20px; background: #fff; border: 1px solid #ddd; border-radius: 4px; } div#ludicity-frontend-editor .lfe-h3-no-top, div#ludicity-frontend-editor-dialog .lfe-h3-no-top { margin-top: 0; } div#ludicity-frontend-editor .lfe-section-h3, div#ludicity-frontend-editor-dialog .lfe-section-h3 { margin-top: 0; margin-bottom: 15px; font-size: 14px; font-weight: 700; color: #2271b1; border-left: 4px solid #2271b1; padding: 6px 0 6px 12px; background: #f0f6fb; border-radius: 0 4px 4px 0; } div#ludicity-frontend-editor .lfe-metabox-section, div#ludicity-frontend-editor-dialog .lfe-metabox-section { margin-bottom: 30px; display: none; } div#ludicity-frontend-editor .lfe-metabox-label, div#ludicity-frontend-editor-dialog .lfe-metabox-label { display: block; font-weight: bold; margin-top: 15px; margin-bottom: 10px; font-size: 14px; } div#ludicity-frontend-editor .lfe-mb-container, div#ludicity-frontend-editor-dialog .lfe-mb-container { margin-bottom: 20px; } /* Fields add row */ div#ludicity-frontend-editor .lfe-fields-add-row, div#ludicity-frontend-editor-dialog .lfe-fields-add-row { display: none; align-items: center; gap: 8px; margin-top: 8px; } div#ludicity-frontend-editor .lfe-fields-dropdown, div#ludicity-frontend-editor-dialog .lfe-fields-dropdown { flex: 1; max-width: 280px; } div#ludicity-frontend-editor .lfe-add-btn-sm, div#ludicity-frontend-editor-dialog .lfe-add-btn-sm { display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px; border: 1px dashed #2271b1; background: #fff; color: #2271b1; cursor: pointer; border-radius: 3px; font-size: 13px; } div#ludicity-frontend-editor .lfe-add-btn-sm .dashicons, div#ludicity-frontend-editor-dialog .lfe-add-btn-sm .dashicons { font-size: 16px; width: 16px; height: 16px; line-height: 1; } /* Tags */ div#ludicity-frontend-editor .lfe-metabox-tags-wrap, div#ludicity-frontend-editor-dialog .lfe-metabox-tags-wrap { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-bottom: 8px; } div#ludicity-frontend-editor .lfe-metabox-tags-inner, div#ludicity-frontend-editor-dialog .lfe-metabox-tags-inner { display: none; flex-wrap: wrap; gap: 6px; align-items: center; } div#ludicity-frontend-editor .lfe-tags-contents, div#ludicity-frontend-editor-dialog .lfe-tags-contents { display: contents; } div#ludicity-frontend-editor .lfe-free-tag-input-wrap, div#ludicity-frontend-editor-dialog .lfe-free-tag-input-wrap { display: inline-flex; align-items: center; border: 1px solid #2271b1; border-radius: 20px; overflow: hidden; background: #fff; } div#ludicity-frontend-editor .lfe-free-tag-input, div#ludicity-frontend-editor-dialog .lfe-free-tag-input { border: none; box-shadow: none; outline: none; padding: 4px 10px; font-size: 12px; background: transparent; color: #2271b1; } div#ludicity-frontend-editor .lfe-free-tag-btn, div#ludicity-frontend-editor-dialog .lfe-free-tag-btn { display: inline-flex; align-items: center; padding: 4px 10px; border: none; background: none; color: #2271b1; cursor: pointer; font-size: 12px; white-space: nowrap; font-weight: 600; } /* Contact */ div#ludicity-frontend-editor .lfe-website-input, div#ludicity-frontend-editor-dialog .lfe-website-input { width: 100%; max-width: 500px; } div#ludicity-frontend-editor .lfe-website-error, div#ludicity-frontend-editor-dialog .lfe-website-error { color: #d63638; font-size: 12px; margin: 4px 0 0; display: none; } div#ludicity-frontend-editor .lfe-add-btn, div#ludicity-frontend-editor-dialog .lfe-add-btn { margin-top: 8px; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px dashed #2271b1; background: #fff; color: #2271b1; cursor: pointer; border-radius: 3px; font-size: 13px; } div#ludicity-frontend-editor .lfe-add-btn .dashicons, div#ludicity-frontend-editor-dialog .lfe-add-btn .dashicons { font-size: 16px; width: 16px; height: 16px; line-height: 1; } /* Inner sections (links/files) */ div#ludicity-frontend-editor .lfe-inner-section, div#ludicity-frontend-editor-dialog .lfe-inner-section { padding: 8px 10px; background: #fafafa; border: 1px solid #e5e5e5; border-radius: 4px; margin-bottom: 8px; display: none; } div#ludicity-frontend-editor .lfe-inner-section-visible, div#ludicity-frontend-editor-dialog .lfe-inner-section-visible { padding: 8px 10px; background: #fafafa; border: 1px solid #e5e5e5; border-radius: 4px; margin-bottom: 8px; } /* When section */ div#ludicity-frontend-editor .lfe-when-header, div#ludicity-frontend-editor-dialog .lfe-when-header { display: flex; align-items: center; justify-content: space-between; margin-top: 15px; margin-bottom: 4px; } div#ludicity-frontend-editor .lfe-when-label, div#ludicity-frontend-editor-dialog .lfe-when-label { font-weight: bold; font-size: 14px; margin: 0; } div#ludicity-frontend-editor .lfe-reset-when-bar, div#ludicity-frontend-editor-dialog .lfe-reset-when-bar { display: none; align-items: center; gap: 6px; } div#ludicity-frontend-editor .lfe-reset-when-status, div#ludicity-frontend-editor-dialog .lfe-reset-when-status { font-size: 11px; color: #666; } div#ludicity-frontend-editor .lfe-reset-when-btn, div#ludicity-frontend-editor-dialog .lfe-reset-when-btn { display: inline-flex; align-items: center; gap: 5px; padding: 5px 12px; border: 1px solid #8c8f94; background: #f6f7f7; color: #3c434a; cursor: pointer; border-radius: 3px; font-size: 12px; } div#ludicity-frontend-editor .lfe-reset-when-btn .dashicons, div#ludicity-frontend-editor-dialog .lfe-reset-when-btn .dashicons { font-size: 14px; width: 14px; height: 14px; line-height: 1.2; } div#ludicity-frontend-editor .lfe-when-sublabel, div#ludicity-frontend-editor-dialog .lfe-when-sublabel { margin: 0 0 10px 0; font-size: 13px; color: #666; display: none; } /* Editor section title (créé dynamiquement par JS) */ div#ludicity-frontend-editor #profile-editor-title, div#ludicity-frontend-editor-dialog #profile-editor-title { margin: 0 0 20px 0; } div#ludicity-frontend-editor #profile-editor-title h2, div#ludicity-frontend-editor-dialog #profile-editor-title h2 { margin: 0; font-size: 20px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } div#ludicity-frontend-editor #profile-editor-title-suffix, div#ludicity-frontend-editor-dialog #profile-editor-title-suffix { font-weight: normal; color: #555; } div#ludicity-frontend-editor #profile-editor-title p, div#ludicity-frontend-editor-dialog #profile-editor-title p { margin: 4px 0 0 0; font-size: 13px; color: #666; } /* Save loading overlay */ div#ludicity-frontend-editor #save-loading-overlay, div#ludicity-frontend-editor-dialog #save-loading-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 9999; display: flex; align-items: center; justify-content: center; } div#ludicity-frontend-editor .lfe-save-overlay-box, div#ludicity-frontend-editor-dialog .lfe-save-overlay-box { background: white; padding: 30px; border-radius: 8px; text-align: center; } div#ludicity-frontend-editor .lfe-save-overlay-spinner, div#ludicity-frontend-editor-dialog .lfe-save-overlay-spinner { border: 4px solid #f3f3f3; border-top: 4px solid #3498db; border-radius: 50%; width: 40px; height: 40px; animation: lfe-spin 1s linear infinite; margin: 0 auto 15px; } div#ludicity-frontend-editor .lfe-save-overlay-box p, div#ludicity-frontend-editor-dialog .lfe-save-overlay-box p { margin: 0; font-size: 16px; color: #333; } @keyframes lfe-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* Loading overlay (créé dynamiquement par JS) */ div#ludicity-frontend-editor #editor-loading-overlay, div#ludicity-frontend-editor-dialog #editor-loading-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255,255,255,0.9); z-index: 9999; display: flex; align-items: center; justify-content: center; } div#ludicity-frontend-editor .lfe-loading-overlay-inner, div#ludicity-frontend-editor-dialog .lfe-loading-overlay-inner { text-align: center; } div#ludicity-frontend-editor .lfe-loading-overlay-inner .spinner, div#ludicity-frontend-editor-dialog .lfe-loading-overlay-inner .spinner { float: none; margin: 0 auto 10px; } div#ludicity-frontend-editor .lfe-loading-overlay-inner p, div#ludicity-frontend-editor-dialog .lfe-loading-overlay-inner p { font-size: 14px; color: #666; } /* Status badges */ div#ludicity-frontend-editor .lfe-status-badge, div#ludicity-frontend-editor-dialog .lfe-status-badge { font-size: 11px !important; line-height: 1.4 !important; font-weight: 600; color: #fff; border-radius: 10px; padding: 2px 8px !important; white-space: nowrap; display: inline-block; vertical-align: middle; } div#ludicity-frontend-editor .lfe-status-badge--publish, div#ludicity-frontend-editor-dialog .lfe-status-badge--publish { background: #2e7d32; } div#ludicity-frontend-editor .lfe-status-badge--pending, div#ludicity-frontend-editor-dialog .lfe-status-badge--pending { background: #e65100; } div#ludicity-frontend-editor .lfe-status-badge--draft, div#ludicity-frontend-editor-dialog .lfe-status-badge--draft { background: #757575; } /* JSON debug display */ div#ludicity-frontend-editor .lfe-json-display, div#ludicity-frontend-editor-dialog .lfe-json-display { margin-top: 20px; padding: 15px; background: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; } div#ludicity-frontend-editor .lfe-json-display h4, div#ludicity-frontend-editor-dialog .lfe-json-display h4 { margin-top: 0; } div#ludicity-frontend-editor .lfe-json-output, div#ludicity-frontend-editor-dialog .lfe-json-output { background: #fff; padding: 10px; border: 1px solid #ccc; border-radius: 3px; overflow-x: auto; max-height: 800px; overflow-y: auto; font-size: 12px; line-height: 1.4; } /* ══════════════════════════════════════════════════════════════════════════ Styles originaux (anciennement dans le bloc