/******* Partie 3 Fichier complet style.css *********/
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Roboto:wght@400;500;700;900&display=swap');

/* --- UTILITAIRES (CRUCIAL POUR LE FONCTIONNEMENT) --- */
.hidden, .fp-hidden {
    display: none !important;
}

/* --- BOUTON FLOTTANT --- */
#furzo-feedback-trigger {
    position: fixed;
    bottom: 20px !important;
    right: 90px !important; 
    z-index: 99990;
    width: 50px; height: 50px; border-radius: 50%;
    background-color: #f3764a; color: white; /* Furzo Orange */
    display: flex; justify-content: center; align-items: center;
    cursor: pointer; box-shadow: 0 8px 20px rgba(243, 118, 74, 0.25);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.3s;
}
#furzo-feedback-trigger:hover { transform: scale(1.1) translateY(-2px); background-color: #e06337; }
#furzo-feedback-trigger .dashicons { font-size: 24px; width: 24px; height: 24px; }

/* BADGE FLASH (Le rond jaune) */
#furzo-flash-badge {
    position: absolute;
    top: 0; right: 0;
    width: 14px; height: 14px;
    background-color: #f1c40f; 
    border: 2px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
    animation: pulse 2s infinite;
}
@keyframes pulse {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(241, 196, 15, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(241, 196, 15, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(241, 196, 15, 0); }
}

/* --- MODALE AIDE --- */
#furzo-feedback-modal {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(43, 45, 66, 0.7); z-index: 99999;
    display: flex; justify-content: center; align-items: center;
}

.furzo-modal-content {
    background: #fff; padding: 30px; border-radius: 24px; /* Premium 24px corners */
    width: 90%; max-width: 850px; position: relative;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.06); /* Diffuse shadow */
    border: 1px solid rgba(243, 118, 74, 0.15); /* Light orange tinted border */
    font-family: 'Outfit', sans-serif; /* Outfit Typography */
    max-height: 90vh; overflow-y: auto;
}

/* --- ONGLETS --- */
.ff-tabs-navigation {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
    border-bottom: 2px solid #eef1f6;
    padding-bottom: 10px;
}
.ff-tab-btn {
    background: none;
    border: none;
    color: #6c757d;
    font-size: 14px;
    font-weight: 700;
    padding: 10px 18px;
    cursor: pointer;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.ff-tab-btn:hover {
    color: #f3764a;
    background: rgba(243, 118, 74, 0.05);
}
.ff-tab-btn.active {
    color: white;
    background: #f3764a;
    box-shadow: 0 6px 15px rgba(243, 118, 74, 0.2);
}

/* --- SYSTEME DE GRILLE --- */
.ff-grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 20px;
    margin-top: 15px;
    padding-bottom: 15px;
}

/* --- CARTES AIDE & TRACKER --- */
.ff-card-item {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0,0,0,0.03);
    display: flex;
    flex-direction: column;
    transition: transform 0.2s, box-shadow 0.2s;
}
.ff-card-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 15px rgba(0,0,0,0.06);
}
.ff-card-banner {
    width: 100%;
    height: 130px;
    overflow: hidden;
    background: #f1f5f9;
    position: relative;
    flex-shrink: 0;
}
.ff-card-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ff-card-body {
    padding: 15px;
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 8px;
}
.ff-card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    color: #94a3b8;
}
.ff-card-badge {
    padding: 3px 8px;
    border-radius: 12px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 9px;
    display: inline-block;
}
.ff-card-badge-info {
    background: rgba(243, 118, 74, 0.1);
    color: #f3764a;
}
.ff-card-badge-bug {
    background: #fee2e2;
    color: #ef4444;
}
.ff-card-badge-status-in_progress {
    background: #fef3c7;
    color: #d97706;
}
.ff-card-badge-status-resolved {
    background: rgba(46, 196, 182, 0.1);
    color: #2ec4b6;
}
.ff-card-title {
    font-size: 14px;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
    line-height: 1.4;
}
.ff-card-text {
    font-size: 12px;
    color: #475569;
    line-height: 1.5;
    margin: 0;
    flex: 1;
}
.ff-card-target {
    font-family: monospace;
    background: #f1f5f9;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 10px;
    color: #64748b;
    word-break: break-all;
}
.ff-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    padding-top: 8px;
    border-top: 1px solid #f1f5f9;
}
.ff-card-date {
    font-size: 11px;
    color: #94a3b8;
}

body.wp-dark-mode-active .ff-card-item {
    background: #252525;
    border-color: #3d3d3d;
}
body.wp-dark-mode-active .ff-card-title {
    color: #f8fafc;
}
body.wp-dark-mode-active .ff-card-text {
    color: #cbd5e1;
}
body.wp-dark-mode-active .ff-card-target {
    background: #1e1e1e;
    color: #94a3b8;
}

/* FLASH BOX (La boîte jaune) */
#furzo-flash-box {
    background: #fff3cd; border: 1px solid #ffeeba; color: #856404;
    padding: 10px 15px; border-radius: 6px; margin-bottom: 20px;
    font-size: 13px; display: flex; align-items: flex-start; justify-content: space-between; gap: 10px;
    line-height: 1.4;
}
.ff-flash-content {
    display: flex; align-items: flex-start; gap: 10px; flex: 1; min-width: 0;
}
#furzo-flash-text {
    flex: 1; word-wrap: break-word; overflow-wrap: break-word;
}
#furzo-flash-box .dashicons { font-size: 20px; color: #856404; flex-shrink: 0; margin-top: 2px; }

/* Croix de fermeture améliorée */
#furzo-flash-close { 
    cursor: pointer; font-size: 20px; font-weight: bold; opacity: 0.6; 
    padding: 0 5px; flex-shrink: 0;
}
#furzo-flash-close:hover { opacity: 1; color: #533f03; }

#furzo-close-modal { position: absolute; top: 15px; right: 15px; cursor: pointer; color: #999; font-size: 20px; }
.furzo-modal-content h3 { margin: 0 0 10px 0; color: #333; font-size: 20px; text-align: center; }
.furzo-subtitle { margin: 0 0 15px 0; color: #666; font-size: 13px; text-align: center; }

/* Privacy */
.ff-privacy-toggle { display: flex; align-items: center; background: #f9f9f9; padding: 8px; border-radius: 6px; margin-bottom: 10px; font-size: 12px; color: #555; box-sizing: border-box; gap: 6px; }
.ff-checkbox-container {
    display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 12px;
    color: #475569;
    user-select: none;
    font-weight: 500;
}
.ff-checkbox-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.ff-checkmark {
    height: 16px;
    width: 16px;
    background-color: #fff;
    border: 2px solid #cbd5e1;
    border-radius: 4px;
    margin-right: 8px;
    display: inline-block;
    position: relative;
    transition: all 0.2s ease;
}
.ff-checkbox-container:hover input ~ .ff-checkmark {
    border-color: #f3764a;
    background-color: #fcf8f6;
}
.ff-checkbox-container input:checked ~ .ff-checkmark {
    background-color: #f3764a;
    border-color: #f3764a;
}
.ff-checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
.ff-checkbox-container input:checked ~ .ff-checkmark:after {
    display: block;
}
.ff-checkbox-container .ff-checkmark:after {
    left: 4px;
    top: 1px;
    width: 4px;
    height: 7px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Tooltip styles */
.ff-info-tooltip-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.ff-info-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #ff9800; /* Orange */
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 20px;
    cursor: help;
    transition: all 0.2s ease;
    font-family: 'Outfit', sans-serif;
    text-align: center;
}
.ff-info-icon:hover {
    background: #e65100;
    color: #fff;
}
.ff-tooltip-content {
    visibility: hidden;
    width: 220px;
    background-color: #1e293b;
    color: #fff;
    text-align: left;
    border-radius: 6px;
    padding: 8px 12px;
    position: absolute;
    z-index: 1000100;
    bottom: 130%;
    left: 50%;
    transform: translateX(-50%) translateY(5px);
    opacity: 0;
    transition: opacity 0.2s ease, transform 0.2s ease;
    font-size: 11px;
    line-height: 1.4;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    pointer-events: none;
    font-weight: normal;
    text-transform: none;
}
/* Tooltip arrow */
.ff-tooltip-content::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: #1e293b transparent transparent transparent;
}
.ff-info-tooltip-wrapper:hover .ff-tooltip-content {
    visibility: visible;
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* Target */
.ff-target-wrapper { margin-bottom: 15px; }
#ff-target-btn {
    background: #fff; border: 2px dashed #cbd5e1; color: #6c757d;
    padding: 12px; width: 100%; border-radius: 12px; cursor: pointer;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    font-weight: 600; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: 'Outfit', sans-serif;
}
#ff-target-btn:hover { border-color: #f3764a; color: #f3764a; background: rgba(243, 118, 74, 0.03); }
#ff-target-result { margin-top: 5px; background: #e8f8f5; border: 1px solid #2ecc71; color: #27ae60; padding: 10px; border-radius: 4px; font-size: 12px; }

/* Form */
#furzo-feedback-form label { display: block; margin-top: 12px; font-weight: 700; font-size: 14px; color: #2b2d42; margin-bottom: 6px; font-family: 'Outfit', sans-serif; }
#furzo-feedback-form select, #furzo-feedback-form textarea {
    width: 100%;
    padding: 14px 18px;
    font-size: 14px;
    border-radius: 12px;
    border: 1.5px solid #dcdcdc;
    background: #fff;
    color: #2b2d42;
    transition: all 0.3s ease;
    box-sizing: border-box;
}
#furzo-feedback-form select:focus, #furzo-feedback-form textarea:focus {
    border-color: #f3764a;
    box-shadow: 0 0 0 4px rgba(243, 118, 74, 0.15);
    outline: none;
}
#ff-submit-btn {
    margin-top: 20px;
    background: #f3764a;
    border: 1px solid #f3764a;
    color: white;
    padding: 15px;
    border-radius: 12px;
    cursor: pointer;
    width: 100%;
    font-size: 15.5px;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(243, 118, 74, 0.15);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: 'Outfit', sans-serif;
}
#ff-submit-btn:hover:not(:disabled) {
    background: #e06337;
    border-color: #e06337;
    box-shadow: 0 10px 25px rgba(243, 118, 74, 0.22);
    transform: translateY(-2px);
}
#ff-submit-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
#ff-response-msg { margin-top: 10px; text-align: center; font-weight: bold; font-size: 13px; }

/* Sniper */
#furzo-sniper-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999999; cursor: crosshair; background: rgba(255, 255, 255, 0.1); pointer-events: none; }
.sniper-controls { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 10px; z-index: 1000000; pointer-events: auto; width: 90%; max-width: 300px; }
.sniper-text { background: rgba(0,0,0,0.8); color: white; padding: 8px 16px; border-radius: 20px; font-weight: bold; font-size: 14px; text-align: center; }
#sniper-cancel-btn { background: #e74c3c; color: white; border: none; padding: 8px 16px; border-radius: 20px; font-weight: bold; cursor: pointer; font-size: 14px; box-shadow: 0 2px 5px rgba(0,0,0,0.3); }
.furzo-element-highlight { outline: 2px solid #e74c3c !important; background-color: rgba(231, 76, 60, 0.2) !important; cursor: crosshair !important; }

/* Dark Mode AIDE */
body.wp-dark-mode-active .furzo-modal-content { background: #1e1e1e; color: #eee; border: 1px solid #444; }
body.wp-dark-mode-active .furzo-modal-content h3 { color: #fff; }
body.wp-dark-mode-active .ff-privacy-toggle { background: #2d2d2d; color: #ccc; }
body.wp-dark-mode-active #ff-target-btn { background: #2d2d2d; border-color: #555; color: #ccc; }
body.wp-dark-mode-active #furzo-feedback-form label { color: #ddd; }
body.wp-dark-mode-active #furzo-feedback-form select, body.wp-dark-mode-active #furzo-feedback-form textarea { background: #2d2d2d; border-color: #555; color: #fff; }
body.wp-dark-mode-active #furzo-flash-box { background: #4d3d00; border-color: #665200; color: #ffd966; }
body.wp-dark-mode-active #furzo-flash-box .dashicons { color: #ffd966; }

/* ==========================================================================
   --- UNIFIED POPUP SYSTEM ---
   ========================================================================== */
#furzo-popup-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999999;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

#furzo-popup-container.fp-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.fp-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.75);
}

.fp-card-wrapper {
    position: relative;
    width: 90%;
    max-width: 520px;
    z-index: 10;
    animation: fpScaleIn 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes fpScaleIn {
    from { transform: scale(0.85); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.fp-card {
    background: #ffffff;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
    position: relative;
    color: #2c3e50;
    font-family: 'Roboto', sans-serif;
    --theme-color: #e67e22;
    --theme-bg-gradient: #e67e22;
}

/* Color HSL variables matching preview */
:root {
    --fp-color-novelty-hsl: 271, 81%, 56%;
    --fp-color-info-hsl: 217, 91%, 53%;
    --fp-color-event-hsl: 28, 95%, 53%;
    --fp-color-cgv-hsl: 42, 93%, 47%;
    --fp-color-bug-fixed-hsl: 142, 72%, 43%;
    --fp-color-bug-in-progress-hsl: 35, 96%, 53%;
}

.fp-card.fp-type-novelty { --theme-color: hsl(var(--fp-color-novelty-hsl)); --theme-bg-gradient: linear-gradient(135deg, hsl(var(--fp-color-novelty-hsl)), #da4453); }
.fp-card.fp-type-info { --theme-color: hsl(var(--fp-color-info-hsl)); --theme-bg-gradient: linear-gradient(135deg, hsl(var(--fp-color-info-hsl)), #00d2ff); }
.fp-card.fp-type-event { --theme-color: hsl(var(--fp-color-event-hsl)); --theme-bg-gradient: linear-gradient(135deg, hsl(var(--fp-color-event-hsl)), #f857a6); }
.fp-card.fp-type-cgv { --theme-color: hsl(var(--fp-color-cgv-hsl)); --theme-bg-gradient: linear-gradient(135deg, hsl(var(--fp-color-cgv-hsl)), #f1c40f); }
.fp-card.fp-type-bug_fixed, .fp-card.fp-type-bug_resolved { --theme-color: hsl(var(--fp-color-bug-fixed-hsl)); --theme-bg-gradient: linear-gradient(135deg, hsl(var(--fp-color-bug-fixed-hsl)), #00b4db); }
.fp-card.fp-type-bug_in_progress { --theme-color: hsl(var(--fp-color-bug-in-progress-hsl)); --theme-bg-gradient: linear-gradient(135deg, hsl(var(--fp-color-bug-in-progress-hsl)), #d97706); }
.fp-card.fp-type-quest { --theme-color: #3498db; --theme-bg-gradient: linear-gradient(135deg, #3498db, #2ecc71); }

/* Dynamic badge colors on frontend popups */
.fp-card.fp-type-novelty .fp-badge { background: rgba(124, 58, 237, 0.15) !important; color: #7c3aed !important; border: none; }
.fp-card.fp-type-info .fp-badge { background: rgba(59, 130, 246, 0.15) !important; color: #3b82f6 !important; border: none; }
.fp-card.fp-type-event .fp-badge { background: rgba(230, 126, 34, 0.15) !important; color: #e67e22 !important; border: none; }
.fp-card.fp-type-cgv .fp-badge { background: rgba(241, 196, 15, 0.15) !important; color: #f1c40f !important; border: none; }
.fp-card.fp-type-bug_fixed .fp-badge, .fp-card.fp-type-bug_resolved .fp-badge { background: rgba(22, 160, 133, 0.15) !important; color: #16a085 !important; border: none; }
.fp-card.fp-type-bug_in_progress .fp-badge { background: rgba(217, 119, 6, 0.15) !important; color: #d97706 !important; border: none; }
.fp-card.fp-type-quest .fp-badge { background: rgba(52, 152, 219, 0.15) !important; color: #3498db !important; border: none; }

body.wp-dark-mode-active .fp-card {
    background: #181818;
    color: #ecf0f1;
    border-color: rgba(255, 255, 255, 0.05);
}

/* Background Lottie behind the content */
.fp-bg-lottie {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0.15;
    z-index: 0;
}

/* Close button */
#furzo-popup-close-btn {
    position: absolute;
    top: 20px;
    right: 20px;
    cursor: pointer;
    font-size: 24px;
    color: #7f8c8d;
    transition: color 0.2s, transform 0.2s;
    z-index: 5;
}
#furzo-popup-close-btn:hover {
    color: #e74c3c;
    transform: scale(1.1);
}

/* Counter */
.fp-counter {
    position: absolute;
    top: -35px;
    right: 5px;
    font-size: 12px;
    font-weight: 700;
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.25);
    padding: 4px 12px;
    border-radius: 20px;
    z-index: 999;
}
body.wp-dark-mode-active .fp-counter {
    background: rgba(255, 255, 255, 0.25);
    color: #ffffff !important;
}

/* Banner */
.fp-banner {
    width: 100%;
    height: 180px;
    background: var(--theme-bg-gradient, linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%));
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    position: relative;
    z-index: 1;
}
body.wp-dark-mode-active .fp-banner {
    background: var(--theme-bg-gradient, linear-gradient(135deg, #2c3e50 0%, #000000 100%));
}
.fp-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Body content */
.fp-body {
    padding: 30px;
    position: relative;
    z-index: 2;
}

.fp-header {
    margin-bottom: 18px;
    text-align: center;
}

.fp-badge {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}

.fp-badge-badge {
    background: #fdf3eb;
    color: #e67e22;
    border: 1px solid #fadfd0;
}
.fp-badge-quest {
    background: #ebf5fb;
    color: #2980b9;
    border: 1px solid #d4e6f1;
}
.fp-badge-info {
    background: #e8f8f5;
    color: #16a085;
    border: 1px solid #d1f2eb;
}

.fp-title {
    font-size: 24px;
    font-weight: 800;
    color: #2c3e50;
    margin: 5px 0 0 0;
    line-height: 1.3;
}
body.wp-dark-mode-active .fp-title {
    color: #ffffff;
}

.fp-content {
    font-size: 15px;
    line-height: 1.6;
    color: #34495e;
    margin-bottom: 25px;
    text-align: center;
}
body.wp-dark-mode-active .fp-content {
    color: #dcdde1;
}

/* Quest & Badge Items */
.furzo-new-badge-item {
    background: rgba(0, 0, 0, 0.02);
    border: 1px solid rgba(0, 0, 0, 0.05);
    border-radius: 16px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 20px;
    text-align: left;
    margin: 10px 0;
}
body.wp-dark-mode-active .furzo-new-badge-item {
    background: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.05);
}
.furzo-new-badge-icon {
    font-size: 40px;
    background: #ffffff;
    border-radius: 50%;
    width: 64px;
    height: 64px;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.06);
    flex-shrink: 0;
}
body.wp-dark-mode-active .furzo-new-badge-icon {
    background: #252525;
}
.furzo-new-badge-texts {
    flex: 1;
}
.furzo-new-badge-texts p {
    margin: 0;
    font-size: 13px;
    color: #7f8c8d;
}
.furzo-new-badge-texts strong {
    display: block;
    font-size: 16px;
    color: #2c3e50;
    margin-top: 4px;
    font-weight: 700;
}
body.wp-dark-mode-active .furzo-new-badge-texts strong {
    color: #ffffff;
}
.furzo-next-step {
    margin-top: 8px;
    font-size: 12px;
    color: #2c3e50;
    background: rgba(0,0,0,0.04);
    padding: 6px 12px;
    border-radius: 8px;
    display: inline-block;
}
body.wp-dark-mode-active .furzo-next-step {
    color: #bdc3c7;
    background: rgba(255,255,255,0.05);
}
.furzo-quest-name-box {
    margin: 15px auto;
    text-align: center;
}
.furzo-quest-name {
    display: inline-block;
    font-size: 18px;
    font-weight: 800;
    color: #ffffff;
}

/* Actions */
.fp-actions-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: 15px;
}

.fp-btn-primary {
    display: inline-block;
    background: var(--theme-bg-gradient, #e67e22);
    color: #ffffff !important;
    text-decoration: none !important;
    text-align: center;
    padding: 8px 20px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 13px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.12);
    transition: background 0.2s, transform 0.2s;
    cursor: pointer;
    border: none;
}
.fp-btn-primary:hover {
    filter: brightness(0.9);
    transform: translateY(-1px);
}

/* Version plus compacte uniquement pour les grilles d'annonces de l'aide */
.ff-changelog-card .fp-btn-primary {
    padding: 5px 12px;
    font-size: 11px;
    border-radius: 6px;
}

.fp-btn-secondary {
    display: inline-block;
    background: rgba(0, 0, 0, 0.05);
    color: #7f8c8d;
    text-align: center;
    padding: 8px 16px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 12px;
    transition: background 0.2s, color 0.2s;
    cursor: pointer;
    border: none;
}
body.wp-dark-mode-active .fp-btn-secondary {
    background: rgba(255, 255, 255, 0.05);
    color: #bdc3c7;
}
.fp-btn-secondary:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #2c3e50;
}
body.wp-dark-mode-active .fp-btn-secondary:hover {
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

/* Rating Section */
.fp-rating-section {
    margin-top: 8px;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    padding-top: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
body.wp-dark-mode-active .fp-rating-section {
    border-color: rgba(255, 255, 255, 0.05);
}
.fp-rating-title {
    display: none !important;
}
body.wp-dark-mode-active .fp-rating-title {
    display: none !important;
}
.fp-rating-buttons {
    display: flex;
    align-items: center;
    gap: 8px;
}
.fp-vote-btn {
    background: transparent;
    border: none;
    padding: 4px;
    cursor: pointer;
    color: #94a3b8;
    transition: transform 0.1s, color 0.2s;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.fp-vote-btn .dashicons {
    font-size: 16px;
    width: 16px;
    height: 16px;
    line-height: 16px;
}
.fp-vote-btn:hover {
    transform: scale(1.2);
    color: #e67e22;
    background: transparent;
}
body.wp-dark-mode-active .fp-vote-btn:hover {
    color: #f3764a;
}
.fp-rating-thanks {
    font-size: 11px;
    font-weight: 700;
    color: #27ae60;
    margin: 0;
    line-height: 1.2;
}

/* --- PERSISTENT ELEMENT HIGHLIGHT --- */
.furzo-element-selected-highlight {
    outline: 4px dashed #e74c3c !important;
    outline-offset: 2px !important;
    animation: furzoPulseBorder 1.5s infinite alternate !important;
}
@keyframes furzoPulseBorder {
    0% { outline-color: #e74c3c; }
    100% { outline-color: rgba(231, 76, 60, 0.2); }
}

/* --- FILTERS & SEARCH BOX --- */
.ff-search-box input:focus {
    color: #1e293b;
}
.ff-pill-btn:hover {
    border-color: #7c3aed !important;
    color: #7c3aed !important;
    background: #fdfdfd !important;
}
.ff-pill-btn.active {
    background: #7c3aed !important;
    border-color: #7c3aed !important;
    color: white !important;
    box-shadow: 0 2px 8px rgba(124,58,237,0.25);
}

/* --- LOADING SKELETONS --- */
.ff-skeleton-card {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: 240px;
}
.ff-skeleton-banner {
    width: 100%;
    height: 130px;
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: skeletonShimmer 1.5s infinite;
}
.ff-skeleton-body {
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}
.ff-skeleton-line {
    height: 12px;
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: skeletonShimmer 1.5s infinite;
    border-radius: 4px;
}
.ff-skeleton-line.title {
    width: 60%;
    height: 16px;
}
.ff-skeleton-line.text {
    width: 100%;
}
.ff-skeleton-line.text-short {
    width: 40%;
}
@keyframes skeletonShimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

body.wp-dark-mode-active .ff-skeleton-card {
    background: #252525;
    border-color: #3d3d3d;
}
body.wp-dark-mode-active .ff-skeleton-banner,
body.wp-dark-mode-active .ff-skeleton-line {
    background: linear-gradient(90deg, #2d2d2d 25%, #3d3d3d 50%, #2d2d2d 75%);
    background-size: 200% 100%;
}

/* --- ANIMATIONS TABS & CARDS --- */
.ff-tab-content {
    animation: fadeInUp 0.4s ease forwards;
}
.ff-card-item {
    animation: fadeInUp 0.4s ease forwards;
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}