/* ============================================================
   PREMIUM ICONS - Global polish layer
   Applies a gradient fill + soft glow + hover lift to every
   icon on the site (Font Awesome + Phosphor Duotone).
   ============================================================ */

/* Phosphor Duotone tint */
:root {
    --ph-primary:   #ffcf3f;   /* gold */
    --ph-secondary: #00d2ff;   /* cyan */
}

/* Default duotone palette (gold dominant + cyan accent) */
.ph-duotone {
    color: var(--ph-primary);
}
.ph-duotone .ph-duotone-fill {
    color: var(--ph-secondary);
    opacity: 0.55;
}

/* ---------- Variants ---------- */
.ph-gold       { --ph-primary:#ffcf3f; --ph-secondary:#ff8c00; }
.ph-cyan       { --ph-primary:#00ffcc; --ph-secondary:#00d2ff; }
.ph-zombie     { --ph-primary:#7CFC00; --ph-secondary:#00ff7f; }
.ph-fire       { --ph-primary:#ff6b6b; --ph-secondary:#ff8c00; }
.ph-discord    { --ph-primary:#5865F2; --ph-secondary:#8a92ff; }
.ph-pink       { --ph-primary:#ff7eb3; --ph-secondary:#ff4f8b; }
.ph-purple     { --ph-primary:#a855f7; --ph-secondary:#7c3aed; }

/* Soft glow halo */
.ph-glow {
    filter: drop-shadow(0 0 8px color-mix(in srgb, currentColor 60%, transparent));
    transition: filter 0.3s ease, transform 0.3s ease;
}
.ph-glow:hover {
    filter: drop-shadow(0 0 14px color-mix(in srgb, currentColor 80%, transparent));
    transform: translateY(-2px) scale(1.06);
}

/* ============================================================
   Font Awesome polish - gives every <i class="fas/fab"> a subtle
   gradient + glow without touching markup. Color is inherited
   from parent (existing inline style="color:#XXX" still wins).
   ============================================================ */
.fas, .far, .fab, .fa-solid, .fa-regular, .fa-brands {
    background: linear-gradient(135deg,
        currentColor 0%,
        color-mix(in srgb, currentColor 70%, #fff 30%) 50%,
        currentColor 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 6px color-mix(in srgb, currentColor 35%, transparent));
    transition: filter 0.3s ease, transform 0.3s ease;
}

/* Hover lift on interactive parents (nav links, buttons, cards) */
a:hover > .fas, a:hover > .far, a:hover > .fab,
button:hover > .fas, button:hover > .far, button:hover > .fab,
.btn:hover .fas, .btn:hover .far, .btn:hover .fab,
.card:hover .fas, .card:hover .far, .card:hover .fab {
    filter: drop-shadow(0 0 12px color-mix(in srgb, currentColor 75%, transparent));
    transform: translateY(-1px) scale(1.08);
}

/* Premium icon "chip" - circular gradient pill behind an icon */
.icon-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4em;
    height: 2.4em;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%,
        color-mix(in srgb, currentColor 35%, transparent),
        color-mix(in srgb, currentColor 8%, transparent) 70%,
        transparent);
    border: 1px solid color-mix(in srgb, currentColor 30%, transparent);
    box-shadow:
        inset 0 0 14px color-mix(in srgb, currentColor 18%, transparent),
        0 0 18px color-mix(in srgb, currentColor 25%, transparent);
    transition: 0.3s ease;
}
.icon-chip:hover {
    transform: scale(1.08);
    box-shadow:
        inset 0 0 22px color-mix(in srgb, currentColor 30%, transparent),
        0 0 28px color-mix(in srgb, currentColor 55%, transparent);
}

/* Crown / VIP shimmer animation for premium badges */
@keyframes premiumShimmer {
    0%, 100% { filter: drop-shadow(0 0 6px rgba(255,207,63,0.4)) brightness(1); }
    50%      { filter: drop-shadow(0 0 16px rgba(255,207,63,0.9)) brightness(1.25); }
}
.ph-shimmer, .fa-crown.ph-shimmer, i.shimmer {
    animation: premiumShimmer 2.6s ease-in-out infinite;
}

/* Pulse for "live" indicators (gift, daily reward, etc.) */
@keyframes premiumPulse {
    0%, 100% { transform: scale(1); }
    50%      { transform: scale(1.12); }
}
.ph-pulse {
    animation: premiumPulse 1.8s ease-in-out infinite;
    transform-origin: center;
}