/*
Theme Name: Raukorim Alpha OS (Blocksy Child)
Theme URI: https://raukorim.fr
Description: L'interface sur-mesure de l'Architecte du Frag. 100% K-Pop Tactique. Purge des Silvers garantie. 🌸
Author: Raukorim
Author URI: https://raukorim.fr
Template: blocksy
Version: 2.0.26
Text Domain: blocksy-child
*/

/* ============================================================
   RAUKORIM.FR - ALPHA OS V2.0.26 - FINAL UNIFIED CSS
   ============================================================ */

/* ⬇️ COLLE L'INTÉGRALITÉ DE TON CSS PERSONNALISÉ JUSTE EN DESSOUS ⬇️ */
/* 1. Base et Scanlines (Vieux Moniteur CRT) */
.titre-alpha {
    position: relative;
    display: inline-block;
}

.titre-alpha::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Crée les petites lignes horizontales noires */
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%);
    background-size: 100% 4px;
    z-index: 20;
    pointer-events: none;
}

/* 2. Le Titre Principal : Blanc + Glow Constant */
.titre-alpha a {
    position: relative;
    color: #FFFFFF !important; /* Force le blanc initial */
    /* Glow constant : Blanc, puis Cyan */
    text-shadow: 0 0 5px #FFFFFF, 0 0 10px rgba(102, 252, 241, 0.7); 
    
    /* ⌛ La Transition de 0.3s pour le HOVER */
    transition: all 0.3s ease-in-out !important; 
    
    display: block;
    z-index: 10;
    
    /* Animations de Boot et Flicker (scintillement subtil) */
    animation: alpha-boot 1.5s ease-out forwards, alpha-flicker 3s infinite 1.5s;
}

/* 3. L’État au Survol (HOVER) : Net et Chirurgical */
.titre-alpha a:hover {
    color: #66FCF1 !important; /* Force le Cyan au hover */
    /* Glow Intensifié sans flickering */
    text-shadow: 0 0 10px #FFFFFF, 0 0 20px #66FCF1, 0 0 30px #66FCF1;
}

/* 4. KEYFRAMES (La Logique des Mouvements) */

/* Animation de boot : apparition type vieux moniteur */
@keyframes alpha-boot {
    0% { opacity: 0; transform: scaleY(0.01) scaleX(0); filter: brightness(5); }
    10% { opacity: 1; transform: scaleY(1) scaleX(1); filter: brightness(2); }
    100% { opacity: 1; transform: scaleY(1) scaleX(1); filter: brightness(1); }
}

/* Animation de Flicker (scintillement subtil) */
@keyframes alpha-flicker {
    0%, 100% { opacity: 1; }
    95% { opacity: 1; }
    96% { opacity: 0.9; }
    97% { opacity: 1; }
}
/* 1. Base et Glow Constant de tous les textes (Cyan-Blanc) */
[data-id="menu"] .ct-menu-link {
    position: relative !important;
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.5) !important;
    transition: all 0.3s ease-in-out !important;
}

/* 2. Glow Rose Constant de l'élément Idole */
li.menu-idole .ct-menu-link {
    color: #FF00FF !important; /* Force la couleur rose idole */
    text-shadow: 0 0 5px rgba(255, 0, 255, 0.5) !important;
}

/* 3. L'effet de Cadre Laser Symétrique avec Glow (Haut et Bas) */
/* C’est ce qui va remplacer tes barres fines actuelles par un cadre complet */
[data-id="menu"] .ct-menu-link::before,
[data-id="menu"] .ct-menu-link::after {
    content: '' !important;
    position: absolute !important;
    left: 50% !important;
    width: 100% !important; /* Elles sont constantes et à pleine largeur */
    height: 1px !important;
    transform: translateX(-50%) !important;
    pointer-events: none;
    transition: box-shadow 0.3s ease-in-out !important;
}

/* Barre du HAUT (::before) */
[data-id="menu"] .ct-menu-link::before {
    top: 0;
    background: rgba(255, 255, 255, 0.5); /* Fine ligne blanche discrète */
    box-shadow: 0 0 5px rgba(102, 252, 241, 0.5); /* Glow Cyan */
}

/* Barre du BAS (::after) */
[data-id="menu"] .ct-menu-link::after {
    bottom: 0;
    background: rgba(255, 255, 255, 0.5); /* Fine ligne blanche discrète */
    box-shadow: 0 0 5px rgba(102, 252, 241, 0.5); /* Glow Cyan */
}

/* Cadre Rose Constant de l'élément Idole */
li.menu-idole .ct-menu-link::before {
    background: rgba(255, 0, 255, 0.5); /* Fine ligne rose discrète */
    box-shadow: 0 0 5px rgba(255, 0, 255, 0.5); /* Glow Rose */
}
li.menu-idole .ct-menu-link::after {
    background: rgba(255, 0, 255, 0.5); /* Fine ligne rose discrète */
    box-shadow: 0 0 5px rgba(255, 0, 255, 0.5); /* Glow Rose */
}

/* 4. Intensification du Glow au Survol (Hover) */
[data-id="menu"] .ct-menu-link:hover {
    color: #66FCF1 !important; /* Force le passage au cyan au hover */
    text-shadow: 0 0 10px #FFFFFF, 0 0 20px #66FCF1 !important;
}

[data-id="menu"] .ct-menu-link:hover::before,
[data-id="menu"] .ct-menu-link:hover::after {
    box-shadow: 0 0 15px #66FCF1 !important; /* Le glow du cadre s’intensifie */
}

/* Hover Rose intensifié pour l’élément Idole */
li.menu-idole .ct-menu-link:hover {
    color: #FF00FF !important; /* Reste rose mais brille plus */
    text-shadow: 0 0 10px #FFFFFF, 0 0 20px #FF00FF !important;
}

li.menu-idole .ct-menu-link:hover::before,
li.menu-idole .ct-menu-link:hover::after {
    box-shadow: 0 0 15px #FF00FF !important;
}
/* --- OVERRIDE TOTAL DES TITRES (H1-H6 & CARDS) --- */

/* 1. On sature les variables de Blocksy et on force le Glow */
h1, h2, h3, h4, h5, h6, 
.entry-title, 
.entry-title a,
[data-prefix="blog"] .entry-card .entry-title a {
    --theme-link-initial-color: #FFFFFF !important; /* On tue leur bleu ici */
    --theme-link-hover-color: #66FCF1 !important;
    font-family: 'Press Start 2P', cursive !important;
    color: #FFFFFF !important;
    text-transform: uppercase !important;
    
    /* Glow Blanc/Cyan constant */
    text-shadow: 0 0 5px #FFFFFF, 0 0 10px rgba(102, 252, 241, 0.8) !important;
    transition: all 0.3s ease-in-out !important;
}

/* 2. Intensification au Survol (Hover) */
h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover,
.entry-title a:hover,
[data-prefix="blog"] .entry-card .entry-title a:hover {
    color: #66FCF1 !important;
    /* Glow Laser au Hover */
    text-shadow: 0 0 10px #FFFFFF, 0 0 20px #66FCF1, 0 0 35px #66FCF1 !important;
}

/* 3. Fix pour le soulignement (Underline) de Blocksy qui peut baver */
.entry-title a {
    text-decoration: none !important;
    box-shadow: none !important;
}

/* --- OPTION : LE PETIT DRAPEAU ROSE (NEWS) --- */
/* Sur ta capture, on voit l'icône drapeau devant [NEWS 001] */
/* Si tu veux qu'il brille lui aussi : */
.entry-title::before {
    filter: drop-shadow(0 0 5px #FF00FF);
}
/* --- LE SLOGAN TACTIQUE (Cyan Neon) --- */
.site-description {
    font-family: 'Roboto Mono', monospace !important; /* Look "Code Source" pour contraster avec le titre */
    color: #66FCF1 !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    margin-top: 10px !important;
    display: block !important;
    
    /* Glow constant pour le réalisme néon */
    text-shadow: 0 0 5px #66FCF1, 0 0 10px rgba(102, 252, 241, 0.6) !important;
    
    /* On réutilise l'animation de scintillement (flicker) du titre pour la cohérence */
    animation: alpha-flicker 4s infinite !important;
    opacity: 0.9;
}

/* Optionnel : Un petit effet au survol du slogan aussi */
.site-description:hover {
    color: #FFFFFF !important;
    text-shadow: 0 0 10px #FFFFFF, 0 0 20px #66FCF1 !important;
    opacity: 1;
}
/* --- CADRE TACTIQUE DES IMAGES --- */

/* 1. État de base de l'image (Sombre et stable) */
.entry-card .ct-media-container img {
    border: 1px solid rgba(102, 252, 241, 0.1) !important; /* Bordure cyan presque invisible */
    transition: all 0.3s ease-in-out !important;
    filter: grayscale(20%) brightness(0.9); /* Un peu plus terne pour faire ressortir le hover */
}

/* 2. État au Survol (Hover) : Verrouillage Laser */
.entry-card:hover .ct-media-container img {
    border: 1px solid #66FCF1 !important; /* Bordure Cyan pure */
    box-shadow: 0 0 20px rgba(102, 252, 241, 0.5) !important; /* Le Glow radioactif */
    filter: grayscale(0%) brightness(1.1); /* L'image s'illumine */
    transform: scale(1.02); /* Très léger zoom pour l'effet de focus */
}

/* --- OPTION : LE GLOW IDOLE (Si tu as des images "Idole") --- */
/* Si tu ajoutes la classe "menu-idole" ou une classe "idole" à l'article */
.idole .ct-media-container img:hover {
    border-color: #FF00FF !important;
    box-shadow: 0 0 20px rgba(255, 0, 255, 0.5) !important;
}
/* --- CALIBRAGE DE LA TAILLE DES TITRES --- */

/* 1. Titre Principal de la Page (H1) - Plus fin, plus pro */
h1 {
    font-size: 22px !important; /* On descend de la zone 30-40px à 22px */
    letter-spacing: -1px !important; /* On resserre un peu les blocs */
    line-height: 1.2 !important;
}

/* 2. Titres des Articles (Cards et Blog) - Look Terminal */
.entry-title, 
.entry-title a,
[data-prefix="blog"] .entry-card .entry-title a {
    font-size: 11px !important; /* Très petit pour le look "Liste de fichiers" */
    letter-spacing: 0px !important;
    line-height: 1.4 !important;
}

/* 3. Sous-titres (H2, H3) dans le corps des articles */
h2 { font-size: 16px !important; }
h3 { font-size: 14px !important; }

/* --- OPTIMISATION MOBILE (CRUCIAL) --- */
/* Sur téléphone, le Press Start 2P est souvent illisible si trop gros */
@media (max-width: 680px) {
    h1 {
        font-size: 16px !important;
    }
    .entry-title, .entry-title a {
        font-size: 9px !important; /* Micro-affichage tactique sur mobile */
    }
}
/* --- STYLE DU BOUTON DE COPIE (PAGE SERVEUR) --- */

.terminal-copy-container {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 15px;
}

/* 1. État de base (Cyan Tactique) */
.terminal-copy-container button#btnCopy {
    font-family: 'Bitcount Prop Single', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 14px !important;
    background-color: #66FCF1 !important;
    color: #121212 !important;
    border-radius: 0px !important;
    border: none !important;
    padding: 15px 30px !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 0 0 5px rgba(102, 252, 241, 0.4) !important;
    cursor: pointer !important;
}

/* 2. État au SURVOL (L'Overdrive) */
.terminal-copy-container button#btnCopy:hover {
    background-color: #FFFFFF !important;
    color: #121212 !important;
    box-shadow: 0 0 20px #66FCF1 !important;
    transform: translateY(-2px);
}

/* 3. État au SUCCÈS (Vert "Izi Pizi") */
.terminal-copy-container button#btnCopy.copy-success {
    background-color: #00FF00 !important;
    color: #FFFFFF !important;
    box-shadow: 0 0 15px #00FF00 !important;
}
/* --- BOUTON MAINFRAME (STATS RÉELLES) --- */

.btn-stats-mainframe {
    font-family: 'Bitcount Prop Single', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 14px !important;
    background-color: #FF00FF !important; /* Magenta Idole */
    color: #000000 !important;
    border-radius: 0px !important;
    border: none !important;
    padding: 15px 30px !important;
    display: inline-block;
    text-decoration: none !important;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 0 0 10px rgba(255, 0, 255, 0.5) !important;
    cursor: pointer !important;
}

/* Hover : Le bouton s'illumine en mode "Sarenghae" */
.btn-stats-mainframe:hover {
    background-color: #FFFFFF !important; /* Passage au blanc pour le flash */
    color: #FF00FF !important; /* Texte passe au rose */
    box-shadow: 0 0 25px #FF00FF !important; /* Explosion de néon rose */
    transform: translateY(-2px) !important;
}
/* --- TERMINAL BOOT SEQUENCE --- */

.terminal-header {
    background: #000;
    padding: 15px;
    font-family: 'IBM Plex Mono', monospace !important;
    font-size: 13px !important;
    color: #66FCF1;
    border-bottom: 1px solid rgba(102, 252, 241, 0.3);
    min-height: 80px;
    margin-bottom: 20px;
    position: relative;
    overflow: hidden;
}

/* Le curseur qui clignote */
.terminal-cursor {
    display: inline-block;
    width: 8px;
    height: 15px;
    background: #66FCF1;
    margin-left: 5px;
    animation: blink-cursor 0.8s infinite;
    vertical-align: middle;
}

@keyframes blink-cursor {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

/* Petit effet de grain/bruit sur le terminal */
.terminal-header::after {
    content: " ";
    position: absolute;
    top: 0; left: 0; bottom: 0; right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%), 
                linear-gradient(90deg, rgba(255, 0, 0, 0.03), rgba(0, 255, 0, 0.01), rgba(0, 0, 255, 0.03));
    background-size: 100% 3px, 3px 100%;
    pointer-events: none;
}
/* ============================================================
   RAUKORIM.FR - ALPHA OS V2.0.26 - FINAL UNIFIED CSS
   (Deploy on Appearance > Customize > Additional CSS)
   ============================================================ */

/* --- GLOBAL HUD ARCHITECTURE --- */
:root {
    --cyan-glow: #66FCF1;
    --magenta-glow: #FF00FF;
    --text-color: #FFFFFF;
    --bg-color: #000000;
}

h1, h2, h3, h4, h5, h6, .entry-title, .entry-title a,
[data-prefix="blog"] .entry-card .entry-title a {
    --theme-link-initial-color: #FFFFFF !important;
    --theme-link-hover-color: #66FCF1 !important;
    font-family: 'Press Start 2P', cursive !important;
    color: #FFFFFF !important;
    text-transform: uppercase !important;
    text-shadow: 0 0 5px #FFFFFF, 0 0 10px rgba(102, 252, 241, 0.8) !important;
    transition: all 0.3s ease-in-out !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

h1:hover, h2:hover, h3:hover, h4:hover, h5:hover, h6:hover, .entry-title a:hover {
    color: #66FCF1 !important;
    text-shadow: 0 0 10px #FFFFFF, 0 0 20px #66FCF1, 0 0 35px #66FCF1 !important;
}

/* --- GLOBAL BUTTONS (PIXEL-TACTIQUE) --- */
button, .button, .ct-button, [type="button"], [type="submit"], .ct-edit-link, .wp-block-button__link {
    font-family: 'Bitcount Prop Single', monospace !important;
    background: #121212 !important;
    color: #66FCF1 !important;
    border: 2px solid #66FCF1 !important;
    text-transform: uppercase !important;
    padding: 10px 20px !important;
    letter-spacing: 2px !important;
    transition: all 0.2s ease !important;
    border-radius: 0px !important;
}

button:hover, .wp-block-button__link:hover {
    background: #66FCF1 !important;
    color: #121212 !important;
    box-shadow: 0 0 20px #66FCF1 !important;
    transform: translateY(-2px);
}

/* ============================================================
   PROFILE PAGE HUD V2 (DÉPLOIEMENT ALPHA - V2.5)
   ============================================================ */

/* --- BACKGROUND & SCANLINES --- */
body.page-id-about {
    background-image: linear-gradient(rgba(102, 252, 241, 0.03) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(102, 252, 241, 0.03) 1px, transparent 1px);
    background-size: 30px 30px;
    background-color: #121212;
}

body.page-id-about::after {
    content: " ";
    position: fixed;
    top: 0; left: 0; bottom: 0; right: 0;
    background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.1) 50%);
    background-size: 100% 4px;
    z-index: 9999;
    pointer-events: none;
    opacity: 0.1;
}

/* --- MAINFRAME CONTAINER --- */
.raukorim-mainframe {
    border: 1px solid #66fcf1 !important;
    box-shadow: 0 0 20px rgba(102, 252, 241, 0.1) !important;
    background-color: #000000 !important;
}

.raukorim-mainframe ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
}

/* --- TYPOGRAPHY --- */
.glitch-title {
    font-family: 'Press Start 2P', cursive !important;
    font-size: 18px !important;
    letter-spacing: 2px;
    text-shadow: 0 0 10px #66fcf1;
    color: #fff !important;
}

.sub-intro {
    font-family: 'IBM Plex Mono', monospace;
    font-size: 13px;
    color: #66fcf1;
    opacity: 0.8;
}

.hud-section-title {
    font-family: 'Press Start 2P', cursive !important;
    font-size: 14px !important;
    border-left: 3px solid #66fcf1;
    padding-left: 15px;
    margin-bottom: 25px !important;
    color: #fff !important;
}

/* --- PORTRAIT & GLITCH ONESHOT AU HOVER --- */
@media (min-width: 782px) {
    .dossier-grid { display: flex !important; gap: 40px !important; }
}

.tactical-portrait {
    margin: 0 auto !important;
    max-width: 280px !important;
}

.tactical-portrait img {
    width: 100% !important;
    height: auto !important;
    border: 1px solid #ff00ff !important;
    box-shadow: 0 0 15px rgba(255, 0, 255, 0.5) !important;
    object-fit: cover;
    aspect-ratio: 2/3;
    transition: all 0.1s ease-out;
}

/* --- !!! NOVELLE ANIMATION DE GLITCH : EXÉCUTION UNIQUE (1) !!! --- */
.tactical-portrait:hover img {
    /* CHIRURGIE TACTIQUE : 'infinite' remplacé par '1' */
    animation: alpha-os-corruption-subtile 0.3s 1 !important; 
    box-shadow: 0 0 5px cyan, 0 0 15px #ff00ff !important;
    cursor: crosshair;
}

@keyframes alpha-os-corruption-subtile {
    0% { transform: translate(0); clip-path: inset(0 0 0 0); filter: brightness(1.1); }
    20% { transform: translate(-1px, 1px); clip-path: inset(10% 0 85% 0); filter: hue-rotate(10deg); }
    40% { transform: translate(1px, -1px); clip-path: inset(40% 0 40% 0); filter: brightness(1.4); }
    60% { transform: translate(-1px, 0); clip-path: inset(80% 0 5% 0); filter: saturate(1.2); }
    100% { transform: translate(0); clip-path: inset(0 0 0 0); filter: brightness(1.1); }
}

.id-tag { font-family: 'IBM Plex Mono', monospace; font-size: 10px; color: #ff00ff; margin-top: 10px !important; }

/* --- DATA SHEET & TRANSMISSIONS --- */
/* --- DATA SHEET V2.6 (OPTIMISATION DE SATURATION) --- */
.data-sheet li {
    font-family: 'Bitcount Prop Single', monospace !important;
    font-size: 13px; /* Légère réduction pour caser plus de data */
    color: #fff;
    padding: 8px 0;
    border-bottom: 1px solid rgba(102, 252, 241, 0.15) !important;
    line-height: 1.4;
    transition: color 0.2s ease;
}

.data-sheet li:hover {
    color: #ff00ff; /* Magenta glow au survol pour le côté Idole */
    cursor: help;
}

.data-sheet li strong { 
    color: #66fcf1; 
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* --- SPECS --- */
.specs-list li {
    font-family: 'Bitcount Prop Single', monospace !important;
    padding: 8px 0;
    color: #fff;
}

/* --- CONTACT LOGIC & BOUTON DISCORD --- */
.contact-logic .wp-block-buttons {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin: 20px 0 !important;
}

.alpha-btn .wp-block-button__link {
    background: #66fcf1 !important;
    color: #000 !important;
    border-radius: 0 !important;
    font-family: 'Bitcount Prop Single', monospace !important;
    font-weight: bold !important;
    text-transform: uppercase;
    box-shadow: 0 0 15px #66fcf1;
    border: none !important;
    transition: 0.3s;
    
    /* Centrage chirurgical (sans espace fantôme HTML) */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 15px 30px !important;
    line-height: 1 !important;
    min-height: 50px;
    margin: 0 !important;
}

.alpha-btn .wp-block-button__link:hover {
    background: #fff !important;
    box-shadow: 0 0 25px #fff;
    transform: scale(1.05);
}

.code-logic { font-family: 'IBM Plex Mono', monospace; color: #66fcf1; font-size: 12px; }
.else-msg { color: #66fcf1; opacity: 0.7; font-size: 14px; margin-top: 10px !important; }

/* --- FOOTER --- */
.footer-sep { border-color: rgba(102, 252, 241, 0.2) !important; margin: 40px 0 !important; }
.footer-log { font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: #66fcf1; opacity: 0.6; }

/* ============================================================
   MODULE YOUTUBE - ARCHIVES VISUELLES (V2.0.26)
   ============================================================ */

/* Container global pour cibler uniquement ce feed */
.youtube-feed-container {
    margin-top: 20px;
    position: relative;
    z-index: 10;
}

/* Forcer le look Bunker sur les éléments internes du plugin Smash Balloon */
.youtube-feed-container .sbyt_item,
.youtube-feed-container .sb_youtube_item {
    background-color: #000000 !important;
    border: 1px solid rgba(102, 252, 241, 0.2) !important;
    padding: 10px !important;
    transition: all 0.3s ease-in-out !important;
}

/* Hover sur les vidéos : Verrouillage Laser et Glow Idole */
.youtube-feed-container .sbyt_item:hover,
.youtube-feed-container .sb_youtube_item:hover {
    border-color: #66FCF1 !important;
    box-shadow: 0 0 15px rgba(102, 252, 241, 0.4) !important;
    transform: scale(1.02);
}

/* Images/Miniatures des vidéos - Mode sombre de base */
.youtube-feed-container img {
    border: 1px solid #FF00FF !important; /* Magenta idole pour les frames vidéo */
    filter: grayscale(20%) brightness(0.9) !important;
    transition: all 0.3s ease-in-out !important;
}

/* Illumination complète au survol */
.youtube-feed-container .sbyt_item:hover img,
.youtube-feed-container .sb_youtube_item:hover img {
    filter: grayscale(0%) brightness(1.1) !important;
    box-shadow: 0 0 15px rgba(255, 0, 255, 0.6) !important;
}

/* Typographie Terminal pour les titres des vidéos */
.youtube-feed-container h3,
.youtube-feed-container .sbyt_title,
.youtube-feed-container .sb_youtube_title {
    font-family: 'Bitcount Prop Single', monospace !important;
    color: #FFFFFF !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    margin-top: 10px !important;
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.5) !important;
    transition: all 0.3s ease-in-out !important;
}

.youtube-feed-container .sbyt_item:hover .sbyt_title,
.youtube-feed-container .sb_youtube_item:hover .sb_youtube_title {
    color: #66FCF1 !important;
    text-shadow: 0 0 10px #66FCF1 !important;
}

/* Bouton "Load More" ou "S'abonner" (Saranghae style) */
.youtube-feed-container .sbyt_btn,
.youtube-feed-container .sb_youtube_btn,
.youtube-feed-container a.sbyt_button {
    background: #121212 !important;
    color: #FF00FF !important; 
    border: 2px solid #FF00FF !important;
    font-family: 'Bitcount Prop Single', monospace !important;
    text-transform: uppercase !important;
    border-radius: 0px !important;
    padding: 10px 20px !important;
    transition: all 0.3s ease !important;
    display: block;
    width: fit-content;
    margin: 20px auto 0 auto !important;
}

.youtube-feed-container .sbyt_btn:hover,
.youtube-feed-container .sb_youtube_btn:hover,
.youtube-feed-container a.sbyt_button:hover {
    background: #FF00FF !important;
    color: #000000 !important;
    box-shadow: 0 0 20px #FF00FF !important;
    transform: translateY(-2px);
}