/* NoxusMu — Skin Shop + Auctions. Stil gotic premium (mov profund + auriu + glow). */

/* buton flotant */
.nxskins-open-btn{ position:fixed; right:18px; bottom:18px; z-index:9000;
    background:linear-gradient(135deg,#7d4bff,#b56bff); color:#fff; border:1px solid rgba(255,215,140,.5);
    border-radius:30px; padding:12px 26px; font:800 14px 'Cinzel','Open Sans',serif; letter-spacing:1px; cursor:pointer;
    box-shadow:0 6px 22px rgba(120,60,255,.5),0 0 0 1px rgba(0,0,0,.3) inset; transition:filter .15s,transform .15s,box-shadow .15s; }
.nxskins-open-btn:hover{ filter:brightness(1.12); transform:translateY(-2px); box-shadow:0 10px 30px rgba(140,80,255,.6); }
.nxskins-open-btn:active{ transform:scale(.96); }

/* backdrop */
.nxskins-wrap{ display:none; position:fixed; inset:0; z-index:100000;
    background:radial-gradient(120% 120% at 50% 0%,rgba(40,16,80,.65),rgba(4,2,12,.9));
    -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);
    align-items:center; justify-content:center; padding:18px; overflow:auto; }
.nxskins-wrap.show{ display:flex; }

/* panou principal — gradient profund + rama aurie + vignette */
.nxskins{ position:relative; width:min(960px,96vw); max-height:92vh; overflow:auto; margin:auto;
    background:
        radial-gradient(90% 60% at 50% -8%,rgba(125,75,255,.22),transparent 60%),
        radial-gradient(70% 50% at 100% 110%,rgba(255,160,60,.10),transparent 55%),
        linear-gradient(165deg,#1d1040 0%,#120829 45%,#0a0518 100%);
    border:1px solid rgba(255,210,130,.30); border-radius:18px;
    box-shadow:0 26px 70px rgba(0,0,0,.7), 0 0 60px rgba(120,60,255,.20),
        inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 0 1px rgba(120,70,200,.18);
    padding:26px 26px 30px; color:#e9ddff; font-family:'Open Sans',sans-serif; }
.nxskins::-webkit-scrollbar{ width:10px; } .nxskins::-webkit-scrollbar-thumb{ background:rgba(150,110,255,.4); border-radius:8px; }

.nxskins-close{ position:absolute; right:14px; top:12px; background:transparent; border:0; color:#cdbdff;
    font:700 28px/1 sans-serif; cursor:pointer; opacity:.75; transition:.15s; }
.nxskins-close:hover{ opacity:1; color:#ffd98a; transform:rotate(90deg); }

/* titlu aurit cu ornamente + sheen */
.nxskins-title{ position:relative; text-align:center; margin:2px 0 4px;
    font:800 30px/1.1 'Cinzel','Open Sans',serif; letter-spacing:4px;
    background:linear-gradient(90deg,#e8b65a,#fff4d6,#ffd98a,#e8b65a); background-size:250% 100%;
    -webkit-background-clip:text; background-clip:text; color:transparent;
    filter:drop-shadow(0 2px 10px rgba(255,190,90,.4)); animation:nxskSheen 7s linear infinite; }
@keyframes nxskSheen{ to{ background-position:250% 0; } }
.nxskins-title::before,.nxskins-title::after{ content:"\2727"; color:#c9a6ff; font-size:16px; opacity:.7; margin:0 14px; -webkit-text-fill-color:#c9a6ff; vertical-align:middle; }
.nxskins-sub{ text-align:center; margin:0 0 10px; color:#b79cff; font-size:13px; letter-spacing:.3px; }
.nxskins-bal{ text-align:center; margin-bottom:18px; font-size:14px; color:#d8c6ff; }
.nxskins-bal b{ color:#ffd98a; font-size:17px; text-shadow:0 0 12px rgba(255,200,90,.4); }

/* tab-uri categorii */
.nxskins-tabs{ display:flex; flex-wrap:wrap; gap:7px; justify-content:center; margin-bottom:6px; }
.nxskins-tab{ background:rgba(124,75,255,.10); border:1px solid rgba(150,110,255,.28); color:#cdbdff;
    border-radius:22px; padding:6px 16px; font:700 12px 'Open Sans',sans-serif; letter-spacing:.6px; cursor:pointer; transition:all .15s; }
.nxskins-tab:hover{ border-color:rgba(255,210,130,.5); color:#fff; transform:translateY(-1px); }
.nxskins-tab.on{ background:linear-gradient(135deg,#7d4bff,#a06bff); color:#fff; border-color:rgba(255,210,130,.55);
    box-shadow:0 4px 14px rgba(125,60,255,.45); }

/* sectiuni + headere cu divizor ornat */
.nxskins-section{ margin-top:18px; }
.nxskins-h{ display:flex; align-items:center; gap:12px; color:#ffd98a; font:800 14px 'Open Sans',sans-serif;
    letter-spacing:1px; text-transform:uppercase; margin-bottom:12px; text-shadow:0 0 12px rgba(255,190,90,.25); }
.nxskins-h::after{ content:""; flex:1; height:1px; background:linear-gradient(90deg,rgba(255,210,130,.5),transparent); }

/* grid + carduri */
.nxskins-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(168px,1fr)); gap:16px; perspective:1200px; }
.nxskins-card{ position:relative; border-radius:14px; padding:14px; text-align:center; isolation:isolate;
    background:linear-gradient(165deg,rgba(255,255,255,.07),rgba(124,75,255,.05) 60%,rgba(0,0,0,.15));
    border:1px solid rgba(150,110,255,.22); transition:transform .18s ease,box-shadow .25s,border-color .25s; }
/* margine luminoasa animata la hover */
.nxskins-card::before{ content:""; position:absolute; inset:-1px; border-radius:14px; padding:1px; z-index:-1;
    background:conic-gradient(from 0deg,#7d4bff,#ffd98a,#a06bff,#7d4bff);
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude;
    opacity:0; transition:opacity .3s; }
.nxskins-card:hover{ transform:translateY(-5px); border-color:transparent; box-shadow:0 16px 40px rgba(120,55,255,.4); }
.nxskins-card:hover::before{ opacity:.9; }

/* zona poza — gradient + glow, arata bine si gol */
.nxskins-img{ position:relative; width:100%; aspect-ratio:1/1; display:flex; align-items:center; justify-content:center;
    margin-bottom:10px; border-radius:10px; overflow:hidden;
    background:radial-gradient(circle at 50% 35%,rgba(160,110,255,.30),rgba(20,10,45,.6) 70%);
    box-shadow:inset 0 0 30px rgba(0,0,0,.5), inset 0 0 0 1px rgba(180,140,255,.15); }
.nxskins-img::after{ content:"\2756"; position:absolute; font-size:34px; color:rgba(201,166,255,.30); }
.nxskins-img img{ position:relative; max-width:100%; max-height:100%; object-fit:contain; z-index:1; filter:drop-shadow(0 4px 12px rgba(0,0,0,.5)); }

.nxskins-name{ color:#fff; font-weight:700; font-size:14px; margin-bottom:4px; min-height:34px; display:flex; align-items:center; justify-content:center; }
.nxskins-price{ color:#ffd98a; font-weight:800; font-size:14px; margin-bottom:11px; text-shadow:0 0 10px rgba(255,200,90,.3); }

.nxskins-buy{ position:relative; overflow:hidden; width:100%; border:1px solid rgba(255,215,140,.35); border-radius:10px;
    padding:9px 0; cursor:pointer; font:800 13px 'Open Sans',sans-serif; letter-spacing:1px; color:#fff;
    background:linear-gradient(135deg,#7d3cff,#b56bff); box-shadow:0 6px 18px rgba(125,60,255,.45); transition:filter .15s,transform .08s; }
.nxskins-buy::after{ content:""; position:absolute; inset:0; background:linear-gradient(120deg,transparent,rgba(255,255,255,.45),transparent); transform:translateX(-120%); }
.nxskins-buy:hover{ filter:brightness(1.12); }
.nxskins-buy:hover::after{ transform:translateX(120%); transition:transform .6s; }
.nxskins-buy:active{ transform:scale(.96); }

/* carduri de licitatie */
.nxskins-auct::before{ background:conic-gradient(from 0deg,#ff7a2a,#ffd98a,#ff5e62,#ff7a2a); }
.nxskins-auct{ border-color:rgba(255,150,90,.30); }
.nxskins-auct.you{ border-color:rgba(120,220,160,.55); box-shadow:0 0 22px rgba(80,220,140,.25); }
.nxskins-tag{ position:absolute; top:10px; left:10px; z-index:3; font:800 10px 'Open Sans',sans-serif; letter-spacing:1px; padding:3px 9px; border-radius:20px; }
.nxskins-tag.excl{ background:linear-gradient(135deg,#ffd24a,#ff8a2a); color:#241000; box-shadow:0 0 14px rgba(255,170,50,.7); animation:nxskPulse 1.8s ease-in-out infinite; }
@keyframes nxskPulse{ 50%{ transform:scale(1.08); } }
.nxskins-abid{ font-size:12px; color:#d8c6ff; margin-bottom:2px; }
.nxskins-abid b{ color:#ffd98a; font-size:15px; }
.nxskins-ahigh{ font-size:11px; color:#a892d8; margin-bottom:5px; min-height:14px; }
.nxskins-ahigh .ymark{ color:#7be0a4; font-weight:800; }
.nxskins-atime{ font-size:12px; color:#caa6ff; margin-bottom:10px; }
.nxskins-cd{ font-weight:800; color:#ff9a6b; text-shadow:0 0 10px rgba(255,120,50,.4); }
.nxskins-cd.ended{ color:#ff6a6a; }
.nxskins-cd.waiting{ color:#a892d8; font-weight:600; font-size:10px; text-shadow:none; }
.nxskins-bidrow{ display:flex; gap:6px; }
.nxskins-bidinput{ flex:1; min-width:0; background:rgba(0,0,0,.3); border:1px solid rgba(255,170,90,.4);
    border-radius:9px; color:#fff; padding:8px; font-size:13px; }
.nxskins-bidinput:focus{ outline:0; border-color:rgba(255,200,120,.7); }
.nxskins-bid{ background:linear-gradient(135deg,#ff7a2a,#ffb13c); color:#241000; border:0; border-radius:9px;
    padding:8px 15px; font:800 13px 'Open Sans',sans-serif; letter-spacing:.5px; cursor:pointer;
    box-shadow:0 5px 16px rgba(255,130,40,.4); transition:filter .12s,transform .07s; }
.nxskins-bid:hover{ filter:brightness(1.1); }
.nxskins-bid:active{ transform:scale(.95); }

/* orders + admin */
.nxskins-orders, .nxskins-pending{ display:flex; flex-direction:column; gap:5px; }
.nxskins-orow{ display:flex; align-items:center; gap:10px; background:rgba(255,255,255,.04); border:1px solid rgba(150,110,255,.12); border-radius:8px; padding:7px 11px; font-size:13px; }
.nxskins-orow .n{ flex:1; color:#fff; font-weight:600; }
.nxskins-orow .d{ color:#a892d8; font-size:12px; }
.nxskins-orow .st{ font-weight:700; font-size:12px; white-space:nowrap; }
.nxskins-orow .st.ok{ color:#7be0a4; } .nxskins-orow .st.pend{ color:#ffd98a; }

.nxskins-adminbox{ background:rgba(255,180,60,.06); border:1px solid rgba(255,190,90,.28); border-radius:12px; padding:12px 14px; }
.nxskins-prow{ display:flex; align-items:center; gap:10px; background:rgba(0,0,0,.22); border-radius:8px; padding:7px 11px; font-size:13px; }
.nxskins-prow .acc{ color:#ffd98a; font-weight:800; min-width:90px; }
.nxskins-prow .n{ flex:1; color:#fff; } .nxskins-prow .src{ color:#caa6ff; font-size:11px; text-transform:uppercase; }
.nxskins-prow .d{ color:#a892d8; font-size:12px; }
.nxskins-deliver{ background:linear-gradient(135deg,#2e9e63,#46c07e); color:#fff; border:0; border-radius:7px; padding:6px 12px; font-weight:700; font-size:12px; cursor:pointer; white-space:nowrap; }
.nxskins-deliver:hover{ filter:brightness(1.12); }

.nxskins-empty{ color:#a892d8; font-style:italic; font-size:13px; padding:6px 2px; }
.nxskins-msg{ text-align:center; margin-top:14px; min-height:18px; font-weight:700; font-size:13px; }
.nxskins-msg.win{ color:#7be0a4; } .nxskins-msg.err{ color:#ff8a8a; }
