/* ========================================= */
/* --- RADIANT HOLO CARD STYLES ---          */
/* ========================================= */

/* Fondos y Bordes Base para la rareza Radiant */
[data-rarity="Radiant"] .card-root {
    border-color: #cbd5e1;
    background: linear-gradient(to bottom, #1a1d24, #1e293b);
}

[data-rarity="Radiant"] .card-bg {
    background-image: url("/img/trainerbg.png"); /* Textura foil base */
    background-size: 25% auto;
}

[data-rarity="Radiant"] .card-overlay {
    background: rgba(0,0,0,0.3);
}

/* Arte de la Carta */
[data-rarity="Radiant"] .card-art {
    border-color: rgba(255, 255, 255, 0.6);
}

/* Etiqueta Inferior */
.rarity-pill.Radiant {
    color: #1e293b;
    border-color: #cbd5e1;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.8), rgba(203, 213, 225, 0.8));
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.5);
}

/* ========================================= */
/* SHINE LAYERS (Efecto Principal)           */
/* ========================================= */

[data-rarity="Radiant"] .fx-radiant {
    display: block;
    --barwidth: 1.2%;
    --space: 200px;
    --hue: 50;
    --imgsize: cover;
    --card-glow: hsla(0, 0%, 100%, 0.5);
    background-image: radial-gradient( farthest-corner ellipse at calc( ((var(--pointer-num-x)) * 0.5%) + 25% ) calc( ((var(--pointer-num-y)) * 0.5%) + 25% ), hsl(0, 0%, 95%) 20%, var(--card-glow) 130% ), repeating-linear-gradient( 45deg, hsl(0,0%,10%) 0%, hsl(0,0%,10%) 1%, hsl(0,0%,10%) var(--barwidth), hsl(0,0%,20%) calc( var(--barwidth) + 0.01% ), hsl(0,0%,20%) calc( var(--barwidth) * 2 ), hsl(0,0%,35%) calc( var(--barwidth) * 2 + 0.01% ), hsl(0,0%,35%) calc( var(--barwidth) * 3 ), hsl(0,0%,42.5%) calc( var(--barwidth) * 3 + 0.01% ), hsl(0,0%,42.5%) calc( var(--barwidth) * 4 ), hsl(0,0%,50%) calc( var(--barwidth) * 4 + 0.01% ), hsl(0,0%,50%) calc( var(--barwidth) * 5 ), hsl(0,0%,42.5%) calc( var(--barwidth) * 5 + 0.01% ), hsl(0,0%,42.5%) calc( var(--barwidth) * 6 ), hsl(0,0%,35%) calc( var(--barwidth) * 6 + 0.01% ), hsl(0,0%,35%) calc( var(--barwidth) * 7 ), hsl(0,0%,20%) calc( var(--barwidth) * 7 + 0.01% ), hsl(0,0%,20%) calc( var(--barwidth) * 8 ), hsl(0,0%,10%) calc( var(--barwidth) * 8 + 0.01% ), hsl(0,0%,10%) calc( var(--barwidth) * 9 ), hsl(0,0%,0%) calc( var(--barwidth) * 9 + 0.01% ), hsl(0,0%,0%) calc( var(--barwidth) * 10 ) ), repeating-linear-gradient( -45deg, hsl(0,0%,10%) 0%, hsl(0,0%,10%) 1%, hsl(0,0%,10%) var(--barwidth), hsl(0,0%,20%) calc( var(--barwidth) + 0.01% ), hsl(0,0%,20%) calc( var(--barwidth) * 2 ), hsl(0,0%,35%) calc( var(--barwidth) * 2 + 0.01% ), hsl(0,0%,35%) calc( var(--barwidth) * 3 ), hsl(0,0%,42.5%) calc( var(--barwidth) * 3 + 0.01% ), hsl(0,0%,42.5%) calc( var(--barwidth) * 4 ), hsl(0,0%,50%) calc( var(--barwidth) * 4 + 0.01% ), hsl(0,0%,50%) calc( var(--barwidth) * 5 ), hsl(0,0%,42.5%) calc( var(--barwidth) * 5 + 0.01% ), hsl(0,0%,42.5%) calc( var(--barwidth) * 6 ), hsl(0,0%,35%) calc( var(--barwidth) * 6 + 0.01% ), hsl(0,0%,35%) calc( var(--barwidth) * 7 ), hsl(0,0%,20%) calc( var(--barwidth) * 7 + 0.01% ), hsl(0,0%,20%) calc( var(--barwidth) * 8 ), hsl(0,0%,10%) calc( var(--barwidth) * 8 + 0.01% ), hsl(0,0%,10%) calc( var(--barwidth) * 9 ), hsl(0,0%,0%) calc( var(--barwidth) * 9 + 0.01% ), hsl(0,0%,0%) calc( var(--barwidth) * 10 ) );
    background-size: cover, 210% 210%, 210% 210%;
    /* Usamos pointer-num-x para cálculos correctos sin romper CSS */
    background-position: center, calc( ((var(--pointer-num-x) - 50) * 1.5%) + 50% ) calc( ((var(--pointer-num-y) - 50) * 1.5%) + 50% ), calc( ((var(--pointer-num-x) - 50) * 1.5%) + 50% ) calc( ((var(--pointer-num-y) - 50) * 1.5%) + 50% );
    background-blend-mode: exclusion, darken, color-dodge;
    filter: brightness(0.5) contrast(2) saturate(1.75);
    mix-blend-mode: color-dodge;
    opacity: var(--opacity);
}

    /* Sub-capa AFTER: Rayos arcoíris diagonales */
    [data-rarity="Radiant"] .fx-radiant:after {
        content: "";
        position: absolute;
        inset: 0;
        background-image: var(--foil), repeating-linear-gradient( 55deg, hsl(3, 95%, 85%) calc(var(--space)*1), hsl(207, 100%, 84%) calc(var(--space)*2), hsl(29, 100%, 85%) calc(var(--space)*3), hsl(160, 100%, 86%) calc(var(--space)*4), hsl(309, 94%, 87%) calc(var(--space)*5), hsl(188, 95%, 85%) calc(var(--space)*6), hsl(3, 95%, 85%) calc(var(--space)*7) );
        background-size: var(--imgsize), 400% 100%;
        background-position: center, calc( ((var(--pointer-num-x) - 50) * -2.5%) + 50% ) calc( ((var(--pointer-num-y) - 50) * -2.5%) + 50% );
        filter: brightness(.6) contrast(3) saturate(2);
        mix-blend-mode: color-dodge;
        background-blend-mode: difference;
    }

    /* Sub-capa BEFORE: Purpurina holográfica (Glitter) */
    [data-rarity="Radiant"] .fx-radiant:before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 2;
        background-image: var(--glitter), radial-gradient( farthest-corner ellipse at calc( ((var(--pointer-num-x)) * 0.5%) + 25% ) calc( ((var(--pointer-num-y)) * 0.5%) + 25% ), hsla(0, 0%, 58%, 0.8) 10%, hsla(0, 0%, 20%, 0.9) 20%, hsla(0, 0%, 20%, 0.5) 50% );
        background-position: center;
        background-size: 15% 15%, 350% 350%;
        background-blend-mode: color-dodge;
        mix-blend-mode: overlay;
        filter: brightness(.66) contrast(2) saturate(.5);
    }

/* ========================================= */
/* GLARE LAYERS                              */
/* ========================================= */

[data-rarity="Radiant"] .card__glare {
    background-image: radial-gradient( farthest-corner circle at var(--pointer-x) var(--pointer-y), hsla(0, 0%, 100%, 0.33) 0%, hsl(0, 0%, 25%) 110% );
    filter: brightness(1) contrast(1.5);
    mix-blend-mode: hard-light;
    opacity: calc( (0.2 * var(--opacity)) + var(--opacity) * var(--hyp) * 0.8 );
}

/* Borde Resplandeciente Reactivo */
[data-rarity="Radiant"] .card-border {
    border-color: #cbd5e1;
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.6), inset 0 0 10px rgba(255, 255, 255, 0.4);
    opacity: calc(var(--opacity) * 0.8);
}