/* ==========================================================================
   THÈME "FLEUR" — Surcharges des pages internes
   MagicTalk, Sang-Satō (manuscrits, personnages, bestiaire, lieux, calendrier),
   Atelier, Boutique.

   À charger APRÈS magictalk.css / sangsato.css / atelier.css / shop.css.
   Ces fichiers codent leurs couleurs en dur (#1e1632, #9b59b6, --mt-glass…),
   donc le thème clair rose ne les atteint pas : on les remappe ici.
   ========================================================================== */

html[data-theme="fleur"] {
    /* Palette de correspondance sombre → rose */
    --fl-deep:     #ffeaf6;  /* remplace #0e0b16 / #0a0a0a */
    --fl-surface:  #fffbfd;  /* remplace #1e1632 (cartes) */
    --fl-surface2: #ffe4f2;  /* remplace #1a1428 */
    --fl-surface3: #ffd9ee;  /* remplace #241b38 */
    --fl-border:   #ffc6e2;  /* remplace #3d2f5e */
    --fl-purple:   #ff3f9a;  /* remplace #9b59b6 */
    --fl-purple-l: #9b5cff;  /* remplace #b57cd9 */
    --fl-ink:      #4b2140;  /* remplace #e8dff8 */
    --fl-muted:    #97648a;  /* remplace #9a87c0 */
    --fl-dim:      #a87ba0;  /* remplace #6b5d8a */
}

/* ==========================================================================
   1. MAGICTALK
   ========================================================================== */

html[data-theme="fleur"] .mt-app,
html[data-theme="fleur"] .magictalk-page,
html[data-theme="fleur"] body {
    --mt-neon-cyan:    #ff8fd0;
    --mt-neon-violet:  #ff3f9a;
    --mt-neon-gold:    #ff9f1c;
    --mt-neon-rose:    #ef476f;
    --mt-glass:        rgba(255, 251, 253, 0.88);
    --mt-glass-border: rgba(255, 63, 154, 0.28);
    --mt-glow-violet:  0 0 18px rgba(255, 63, 154, 0.30);
    --mt-glow-cyan:    0 0 18px rgba(155, 92, 255, 0.28);
    --mt-glow-gold:    0 0 12px rgba(255, 159, 28, 0.35);
}

/* Le sélecteur ci-dessus suppose une classe racine sur MagicTalk.
   Si feed.php n'en a pas, cette version globale prend le relais : */
html[data-theme="fleur"] {
    --mt-neon-cyan:    #ff8fd0;
    --mt-neon-violet:  #ff3f9a;
    --mt-neon-gold:    #ff9f1c;
    --mt-neon-rose:    #ef476f;
    --mt-glass:        rgba(255, 251, 253, 0.88);
    --mt-glass-border: rgba(255, 63, 154, 0.28);
    --mt-glow-violet:  0 0 18px rgba(255, 63, 154, 0.30);
    --mt-glow-cyan:    0 0 18px rgba(155, 92, 255, 0.28);
    --mt-glow-gold:    0 0 12px rgba(255, 159, 28, 0.35);
}

/* --- Filet de sécurité : fonds réappliqués en dur ---------------------------
   Si le <link> de ce fichier est chargé AVANT magictalk.css, les surcharges de
   variables ci-dessus peuvent perdre à égalité de spécificité. Ces règles-ci
   sont plus spécifiques que celles de magictalk.css, donc elles passent
   quel que soit l'ordre de chargement. (Idéal quand même : charger ce fichier
   en DERNIER.)                                                              */
html[data-theme="fleur"] .mt-post,
html[data-theme="fleur"] .mt-composer,
html[data-theme="fleur"] .mt-side-card,
html[data-theme="fleur"] .mt-suggest-card,
html[data-theme="fleur"] .mt-nav,
html[data-theme="fleur"] .mt-panthéon,
html[data-theme="fleur"] .mt-modal__content,
html[data-theme="fleur"] .mt-search-form__input {
    background: rgba(255, 251, 253, 0.92);
    border-color: rgba(255, 63, 154, 0.28);
}

html[data-theme="fleur"] .mt-post__divider,
html[data-theme="fleur"] .mt-post__actions,
html[data-theme="fleur"] .mt-composer__divider,
html[data-theme="fleur"] .mt-post__comments {
    border-color: rgba(255, 63, 154, 0.22);
}

html[data-theme="fleur"] .mt-post__content,
html[data-theme="fleur"] .mt-composer__textarea,
html[data-theme="fleur"] .mt-side-user__name,
html[data-theme="fleur"] .mt-search-form__input {
    color: #4b2140;
}

html[data-theme="fleur"] .mt-post__time,
html[data-theme="fleur"] .mt-post__handle,
html[data-theme="fleur"] .mt-side-user__followers,
html[data-theme="fleur"] .mt-composer__counter {
    color: #97648a;
}

/* Onglet actif de la navigation latérale (Flux) */
html[data-theme="fleur"] .mt-nav__link.active,
html[data-theme="fleur"] .mt-nav__link:hover {
    background: rgba(255, 63, 154, 0.12);
    color: #ff3f9a;
}
html[data-theme="fleur"] .mt-nav__link { color: #97648a; }

/* Titres dorés des cartes latérales */
html[data-theme="fleur"] .mt-side-card__title { color: #ff3f9a; }

/* Textes et fonds noirs codés en dur dans magictalk.css */
html[data-theme="fleur"] .mt-post,
html[data-theme="fleur"] .mt-composer,
html[data-theme="fleur"] .mt-side-card,
html[data-theme="fleur"] .mt-suggest-card,
html[data-theme="fleur"] .mt-panthéon,
html[data-theme="fleur"] .mt-modal__content {
    color: var(--fl-ink);
    box-shadow: 0 4px 18px rgba(255, 63, 154, 0.10);
}

html[data-theme="fleur"] .mt-composer__input,
html[data-theme="fleur"] .mt-comment-form input,
html[data-theme="fleur"] .mt-comment {
    background: var(--fl-surface2);
    color: var(--fl-ink);
}
html[data-theme="fleur"] .mt-composer__input::placeholder,
html[data-theme="fleur"] .mt-comment-form input::placeholder {
    color: var(--fl-muted);
}

/* Boutons d'action : le violet néon devient rose bonbon */
html[data-theme="fleur"] .mt-composer__submit,
html[data-theme="fleur"] .mt-comment-form button,
html[data-theme="fleur"] .mt-btn--violet {
    background: linear-gradient(135deg, #ff6ec4, #ff3f9a 45%, #9b5cff);
    color: #fffbfd;
    border-radius: 999px;
}

html[data-theme="fleur"] .mt-btn,
html[data-theme="fleur"] .mt-follow-btn,
html[data-theme="fleur"] .mt-action-btn {
    border-radius: 999px;
}

html[data-theme="fleur"] .mt-action-btn { color: var(--fl-muted); }
html[data-theme="fleur"] .mt-action-btn:hover { background: rgba(255, 63, 154, 0.10); color: var(--fl-purple); }

/* Overlays noirs (stories, modale image) : on garde sombre pour la lisibilité
   des photos, mais on adoucit le voile */
html[data-theme="fleur"] .mt-story-viewer,
html[data-theme="fleur"] .mt-modal {
    background: rgba(75, 33, 64, 0.88);
}
html[data-theme="fleur"] .mt-modal__nav { background: rgba(255, 63, 154, 0.35); }
html[data-theme="fleur"] .mt-modal__nav:hover { background: rgba(255, 63, 154, 0.6); }

/* Skeleton de chargement */
html[data-theme="fleur"] .mt-skeleton {
    background: linear-gradient(90deg, var(--fl-surface2) 25%, var(--fl-surface) 50%, var(--fl-surface2) 75%);
    background-size: 200% 100%;
}

/* Cartes latérales (Mages à découvrir / Panthéon) */
html[data-theme="fleur"] .mt-side-card,
html[data-theme="fleur"] .mt-suggest-card,
html[data-theme="fleur"] .mt-nav-card {
    background: var(--fl-surface);
    border-color: var(--fl-border);
    border-radius: 26px;
}
html[data-theme="fleur"] .mt-nav-link.is-active,
html[data-theme="fleur"] .mt-nav-link:hover {
    background: rgba(255, 63, 154, 0.12);
    color: var(--fl-purple);
}

/* ==========================================================================
   2. SANG-SATŌ — commun (bestiaire, lieux, factions, personnages, calendrier)
   ========================================================================== */

/* Cartes de fiche (.ss-p-card sert aussi au bestiaire et aux lieux) */
html[data-theme="fleur"] .ss-p-card {
    background: var(--fl-surface);
    border-color: var(--fl-border);
    border-radius: 26px;
}
html[data-theme="fleur"] .ss-p-card:hover {
    border-color: var(--fl-purple);
    box-shadow: 0 6px 24px rgba(255, 63, 154, 0.22);
}
html[data-theme="fleur"] .ss-p-card__img {
    background: var(--fl-deep);
    background-image: radial-gradient(circle at 30% 20%, rgba(255, 63, 154, .12), transparent 60%);
}
html[data-theme="fleur"] .ss-p-card__img::after { color: var(--fl-dim); }
html[data-theme="fleur"] .ss-p-card__body {
    background: linear-gradient(to top, rgba(255, 234, 246, .96), rgba(255, 234, 246, .82) 70%, transparent);
}
html[data-theme="fleur"] .ss-p-card__cat  { color: var(--fl-purple-l); }
html[data-theme="fleur"] .ss-p-card__nom  { color: var(--fl-ink); }
html[data-theme="fleur"] .ss-p-card__sub  { color: var(--fl-muted); }

/* Filtres de catégorie */
html[data-theme="fleur"] .ss-cat-btn { border-radius: 999px; }
html[data-theme="fleur"] .ss-cat-btn:hover { border-color: var(--fl-purple); }
html[data-theme="fleur"] .ss-cat-btn.is-active {
    background: linear-gradient(135deg, #ff6ec4, #ff3f9a 45%, #9b5cff);
    border-color: transparent;
    color: #fffbfd;
}

/* Cartes de navigation de l'univers */
html[data-theme="fleur"] .ss-nav-card { border-radius: 26px; }
html[data-theme="fleur"] .ss-nav-card:hover { border-color: var(--fl-purple); }
html[data-theme="fleur"] .ss-nav-card__full-badge {
    color: var(--fl-purple);
    background: rgba(255, 63, 154, .12);
    border-color: rgba(255, 63, 154, .3);
}

/* Bandeau de tête */
html[data-theme="fleur"] .ss-hero {
    background: linear-gradient(to bottom, rgba(255, 63, 154, .10), transparent);
}
html[data-theme="fleur"] .ss-hero p,
html[data-theme="fleur"] .ss-back-link { color: var(--fl-muted); }
html[data-theme="fleur"] .ss-back-link { border-radius: 999px; }
html[data-theme="fleur"] .ss-back-link:hover {
    background: rgba(255, 63, 154, 0.10);
    border-color: var(--fl-purple);
    color: var(--fl-purple);
}

/* Fiches détaillées (modale) */
html[data-theme="fleur"] .ss-dialog { border-radius: 26px; }
html[data-theme="fleur"] .ss-dialog::backdrop { background: rgba(75, 33, 64, .55); }
html[data-theme="fleur"] .ss-dialog-header {
    background: linear-gradient(135deg, var(--ac-card), rgba(255, 63, 154, .10));
}
html[data-theme="fleur"] .ss-dialog-body h3,
html[data-theme="fleur"] .ss-dialog-body blockquote { color: var(--fl-purple-l); }
html[data-theme="fleur"] .ss-dialog-body { scrollbar-color: var(--fl-purple) transparent; }
html[data-theme="fleur"] .ss-dialog-body::-webkit-scrollbar-thumb {
    background: linear-gradient(to bottom, var(--fl-purple), var(--fl-purple-l));
    background-clip: padding-box;
}

/* Calendrier / fêtes / saisons */
html[data-theme="fleur"] .ss-month-card,
html[data-theme="fleur"] .ss-season-card,
html[data-theme="fleur"] .ss-fete-card,
html[data-theme="fleur"] .ss-converter { border-radius: 26px; }
html[data-theme="fleur"] .ss-converter { border-color: var(--fl-border); }
html[data-theme="fleur"] .ss-converter-result {
    background: var(--fl-deep);
    border-color: var(--fl-border);
    color: var(--fl-ink);
}
html[data-theme="fleur"] .ss-month-card__pron,
html[data-theme="fleur"] .ss-fete-pos { color: var(--fl-muted); }
html[data-theme="fleur"] .ss-conv-zodiac { border-top-color: var(--fl-border); }
html[data-theme="fleur"] .ss-fete-header:hover { background: rgba(255, 63, 154, .07); }
html[data-theme="fleur"] .ss-fete-body blockquote {
    border-left-color: var(--fl-purple);
    color: var(--fl-purple-l);
}

/* ==========================================================================
   3. SANG-SATŌ — Manuscrits (.ms-*)
   ========================================================================== */

html[data-theme="fleur"] .ms-card {
    background: var(--fl-surface);
    border-color: var(--fl-border);
    border-radius: 26px;
}
html[data-theme="fleur"] .ms-card:hover {
    border-color: var(--fl-purple);
    box-shadow: 0 6px 24px rgba(255, 63, 154, .22);
}
html[data-theme="fleur"] .ms-cover {
    background: var(--fl-deep);
    background-image: radial-gradient(circle at 30% 20%, rgba(255, 63, 154, .18), transparent 60%);
}
html[data-theme="fleur"] .ms-serie       { color: var(--fl-purple-l); }
html[data-theme="fleur"] .ms-titre       { color: var(--fl-ink); }
html[data-theme="fleur"] .ms-sous-titre,
html[data-theme="fleur"] .ms-synopsis    { color: var(--fl-muted); }
html[data-theme="fleur"] .ms-progress-label,
html[data-theme="fleur"] .ms-meta        { color: var(--fl-dim); }
html[data-theme="fleur"] .ms-progress-bar {
    background: var(--fl-deep);
    border-color: var(--fl-border);
}
html[data-theme="fleur"] .ms-progress-fill {
    background: linear-gradient(90deg, #9b5cff, #ff3f9a);
}
html[data-theme="fleur"] .ms-live-dot::before { background: var(--ac-success); }

/* ==========================================================================
   4. ATELIER (privé, mais autant qu'il suive)
   ========================================================================== */

html[data-theme="fleur"] {
    --at-bg:         #fff2f9;
    --at-bg2:        #ffe4f2;
    --at-bg3:        #ffd9ee;
    --at-card:       #fffbfd;
    --at-border:     #ffc6e2;
    --at-purple:     #ff3f9a;
    --at-purple-lt:  #9b5cff;
    --at-gold:       #ff9f1c;
    --at-gold-lt:    #ffc266;
    --at-text:       #4b2140;
    --at-text-muted: #97648a;
    --at-text-dim:   #a87ba0;
    --at-shadow:     0 4px 24px rgba(255, 63, 154, .18);
    --at-glow:       0 0 20px rgba(255, 63, 154, .22);
}

/* ==========================================================================
   5. Boutique & divers — texte sur fond accent
   ========================================================================== */

html[data-theme="fleur"] .shop-price-tag,
html[data-theme="fleur"] .adm-btn-gold,
html[data-theme="fleur"] .adm-filter-btn.active,
html[data-theme="fleur"] .adm-page-link.active {
    color: var(--ac-on-accent);
}

/* Le Marché Noir garde volontairement son ambiance rouge/noire :
   c'est une zone « interdite », le contraste fait partie du décor.
   Décommenter si Fleur veut qu'il devienne rose aussi :
html[data-theme="fleur"] .bm-wrap { filter: hue-rotate(300deg) saturate(.7) invert(.9); }
*/

@media (prefers-reduced-motion: reduce) {
    html[data-theme="fleur"] .ms-live-dot::before { animation: none; }
}
