/* 09 — Correções (perfil tema full-page, bazar badge/categoria, nome fx, login logo) */

/* ============================================================
   1) TEMA DO PERFIL COBRE A PÁGINA INTEIRA (mobile + PC)
   ============================================================ */
body.has-profile-theme .bg-aurora,
body.has-profile-theme .bg-grain { display: none !important; }

/* base: cor cheia atrás de tudo, colada no viewport */
body.has-profile-theme { background: #05070d; }
body.has-profile-theme::before {
    content: "";
    position: fixed; inset: 0; z-index: -1;
    pointer-events: none;
    background: transparent;
    transition: opacity .3s ease;
}

/* cada tema pinta o ::before do body */
body.body-theme-oceano::before {
    background: linear-gradient(120deg, #0ea5e9, #0d0b14 60%, #22d3ee);
    background-size: 220% 220%; animation: themeDrift 10s ease-in-out infinite;
    opacity: .75;
}
body.body-theme-sunset::before {
    background: linear-gradient(120deg, #f97316, #0d0b14 55%, #ec4899);
    background-size: 220% 220%; animation: themeDrift 10s ease-in-out infinite;
    opacity: .7;
}
body.body-theme-neon::before {
    background:
        radial-gradient(circle at 30% 20%, #a855f7, transparent 60%),
        radial-gradient(circle at 80% 80%, #ec4899, transparent 55%),
        #0d0b14;
    animation: neonPulse 3s ease-in-out infinite;
    opacity: .8;
}
body.body-theme-floresta::before {
    background: linear-gradient(120deg, #059669, #0d0b14 60%, #34d399);
    background-size: 220% 220%; animation: themeDrift 12s ease-in-out infinite;
    opacity: .7;
}
body.body-theme-galaxia::before {
    background:
        radial-gradient(1px 1px at 15% 25%, #fff 100%, transparent),
        radial-gradient(1.5px 1.5px at 65% 65%, #fff 100%, transparent),
        radial-gradient(1px 1px at 40% 80%, #fff 100%, transparent),
        radial-gradient(1px 1px at 85% 15%, #fff 100%, transparent),
        linear-gradient(135deg, #1e1b4b, #0d0b14 60%, #4c1d95);
    background-size: 200% 200%, 200% 200%, 200% 200%, 200% 200%, 260% 260%;
    animation: themeDrift 16s ease-in-out infinite;
    opacity: .85;
}
body.body-theme-dourado::before {
    background: linear-gradient(120deg, #b45309, #0d0b14 55%, #f59e0b, #0d0b14);
    background-size: 260% 260%; animation: themeDrift 8s ease-in-out infinite;
    opacity: .7;
}
body.body-theme-arcoiris::before {
    background: linear-gradient(90deg, #f87171, #fb923c, #f5d90a, #34d399, #38bdf8, #a855f7, #f87171);
    background-size: 300% 100%; animation: rainbowMove 6s linear infinite;
    opacity: .55;
}

/* Como o tema agora está no body, escondemos o retângulo interno do perfil */
body.has-profile-theme .profile-page .profile-theme-bg { display: none !important; }
body.has-profile-theme .profile-v3 .profile-hero-inner { background: rgba(3, 8, 20, 0.55); }

/* ============================================================
   2) BAZAR — categoria (bottom-right) NÃO colide com "Em destaque"
   ============================================================ */
.bazar-card-cat--bottom {
    position: absolute;
    top: auto !important; left: auto !important;
    bottom: 8px; right: 8px;
    background: rgba(0,0,0,0.65);
    color: #fff;
    font-size: 11px;
    padding: 4px 8px;
    border-radius: 999px;
    backdrop-filter: blur(6px);
    z-index: 1;
}

/* IMAGEM DO ITEM VISÍVEL POR INTEIRO no card (sem cortar) */
.bazar-card-media {
    background: #06090f;
}
.bazar-card-media img {
    width: 100%; height: 100%;
    object-fit: contain !important;  /* mostra o item inteiro */
    background: #06090f;
}

/* Ampliar foto na página do item */
.bazar-item-media--full { background: #06090f; }
.bazar-item-media--full img {
    width: 100%; height: 100%;
    object-fit: contain !important;
    cursor: zoom-in;
}

/* Nome + selos do vendedor: uma linha, sem sobrepor */
.bazar-card-user { flex-wrap: wrap; }
.bazar-card-uname { display: inline-flex; align-items: center; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.bazar-card-badges {
    display: inline-flex; align-items: center; gap: 4px;
    margin-left: 2px;
}
.bazar-card-badges .verified-badge,
.bazar-card-badges .premium-badge { position: static; margin: 0; }

.bazar-seller-name {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.bazar-seller-badges {
    display: inline-flex; align-items: center; gap: 4px;
}
.bazar-seller-badges .verified-badge,
.bazar-seller-badges .premium-badge { position: static; margin: 0; }

/* ============================================================
   3) Cat-nav no PC: dá pra arrastar (cursor grab + suaviza scroll)
   ============================================================ */
.bazar-cat-nav {
    cursor: grab;
    scroll-behavior: smooth;
    user-select: none;
    -webkit-overflow-scrolling: touch;
}
.bazar-cat-nav.is-dragging {
    cursor: grabbing;
    scroll-behavior: auto;
}
.bazar-cat-nav.is-dragging a { pointer-events: none; }

/* ============================================================
   4) NOME NO PERFIL — remover a "borda retangular" causada pelo
      overflow:hidden que estava cortando o text-shadow em retângulo
   ============================================================ */
.profile-v3 .profile-info h1 {
    overflow: visible !important;
    padding: 2px 0;
}
.profile-v3 .profile-info h1 .uname {
    display: inline-block;
    line-height: 1.2;
    padding: 0 2px;
    overflow: visible;
}
/* segurança: nenhum fx com background herda um "bloco" visível */
.uname-fx-gradiente,
.uname-fx-arcoiris {
    -webkit-text-fill-color: transparent;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

/* ============================================================
   5) LOGO — remover a "passagem" lateral (shine) em TODO lugar
      (topbar, auth/login, etc). Fica um pulse/glow estático.
   ============================================================ */
.logo,
.auth-logo,
.topbar .logo {
    animation: authLogoPulse 2.8s ease-in-out infinite !important;
    background-size: 100% auto !important;
    background-position: center center !important;
    transform-origin: center;
    /* trava o gradiente para não deslizar */
}
/* mata explicitamente qualquer keyframe "shine" herdado */
.logo, .auth-logo, .topbar .logo {
    animation-name: authLogoPulse !important;
}
@keyframes authLogoPulse {
    0%, 100% {
        transform: scale(1);
        filter: drop-shadow(0 0 6px rgba(124,58,237,0.35))
                drop-shadow(0 0 14px rgba(236,72,153,0.15));
    }
    50% {
        transform: scale(1.03);
        filter: drop-shadow(0 0 12px rgba(124,58,237,0.7))
                drop-shadow(0 0 24px rgba(236,72,153,0.4));
    }
}

/* ============================================================
   4b) FIX BRILHO NEON / FOGO — o retângulo é o text-shadow sendo
       cortado pelos overflow:hidden do .profile-info e h1.
       Liberamos overflow e damos respiro só quando esses fx estão ativos.
   ============================================================ */
.profile-v3 .profile-info:has(.uname-fx-brilho),
.profile-v3 .profile-info:has(.uname-fx-fogo),
.profile-v3 .profile-info:has(.uname-fx-brilho) h1,
.profile-v3 .profile-info:has(.uname-fx-fogo) h1 {
    overflow: visible !important;
}
.uname-fx-brilho,
.uname-fx-fogo {
    display: inline-block;
    padding: 2px 6px;
    margin: 2px 0;
    background: transparent !important;
    -webkit-background-clip: initial !important;
    background-clip: initial !important;
    -webkit-text-fill-color: currentColor !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    line-height: 1.25;
}
/* fallback para navegadores sem :has() — libera overflow sempre no perfil.
   O ellipsis do username segue funcionando pois está em .profile-username. */
@supports not selector(:has(*)) {
    .profile-v3 .profile-info,
    .profile-v3 .profile-info h1 { overflow: visible !important; }
}