/* WORLD-PERFORMANCE FORCE PREMIUM UI - replaces dashboard-v2.css */

:root{
--bg:#050505;
--panel:#0f0f0f;
--panel2:#151515;
--border:rgba(255,255,255,.075);
--accent:#e30613;
--accent2:#ff3340;
--text:#fff;
--muted:#a0a0a0;
--success:#5cff9d;
--warning:#ffc14f;
--blue:#7ab7ff;
--shadow:0 22px 80px rgba(0,0,0,.55);
}

*{box-sizing:border-box;margin:0;padding:0}

html,body{
min-height:100%;
background:
radial-gradient(circle at 86% 4%, rgba(227,6,19,.16), transparent 26%),
radial-gradient(circle at 10% 92%, rgba(255,255,255,.045), transparent 24%),
linear-gradient(180deg,#080808,#030303)!important;
color:var(--text)!important;
font-family:Arial,Helvetica,sans-serif!important;
-webkit-font-smoothing:antialiased;
}

a{color:inherit}

.layout{
display:flex;
min-height:100vh;
}

.sidebar{
width:292px!important;
min-height:100vh;
position:fixed!important;
left:0;
top:0;
bottom:0;
padding:32px 22px!important;
background:
linear-gradient(180deg,rgba(18,18,18,.96),rgba(8,8,8,.98))!important;
border-right:1px solid var(--border)!important;
box-shadow:18px 0 60px rgba(0,0,0,.35)!important;
backdrop-filter:blur(18px)!important;
overflow:auto;
}

.logo{
font-size:0!important;
color:transparent!important;
line-height:1!important;
margin-bottom:42px!important;
position:relative;
width:245px;
height:58px;
}

.logo::before{
content:"WORLD";
display:block;
font-size:28px;
font-weight:1000;
letter-spacing:.23em;
color:#fff;
text-transform:uppercase;
text-shadow:0 0 24px rgba(255,255,255,.08);
}

.logo::after{
content:"PERFORMANCE";
display:block;
margin-top:8px;
font-size:15px;
font-weight:1000;
letter-spacing:.36em;
color:var(--accent);
text-transform:uppercase;
text-shadow:0 0 28px rgba(227,6,19,.55);
}

.logo span,.logo img{display:none!important}

.menu{
display:flex!important;
flex-direction:column!important;
gap:11px!important;
}

.menu a{
position:relative;
display:flex!important;
align-items:center;
min-height:52px;
padding:15px 18px!important;
border-radius:18px!important;
background:rgba(255,255,255,.025)!important;
border:1px solid rgba(255,255,255,.045)!important;
color:#d7d7d7!important;
font-weight:900!important;
font-size:14px!important;
text-decoration:none!important;
letter-spacing:.02em;
transition:.18s ease!important;
overflow:hidden;
}

.menu a::before{
content:"";
position:absolute;
left:0;
top:50%;
width:4px;
height:0;
background:var(--accent);
border-radius:999px;
transform:translateY(-50%);
transition:.18s;
}

.menu a:hover{
background:rgba(255,255,255,.055)!important;
transform:translateX(4px);
border-color:rgba(255,255,255,.09)!important;
}

.menu a:hover::before{height:24px}

.menu a.active{
background:linear-gradient(135deg,#e30613,#820008)!important;
color:#fff!important;
box-shadow:0 14px 34px rgba(227,6,19,.28)!important;
border-color:rgba(255,255,255,.12)!important;
}

.menu a.active::before{
height:100%;
background:rgba(255,255,255,.34);
}

.main{
margin-left:292px!important;
width:calc(100% - 292px)!important;
padding:36px!important;
}

.topbar-v2{
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
gap:20px;
padding:26px 30px!important;
margin-bottom:30px!important;
border-radius:30px!important;
background:
linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025))!important;
border:1px solid var(--border)!important;
box-shadow:var(--shadow)!important;
backdrop-filter:blur(20px)!important;
}

.topbar-v2 h1{
font-size:36px!important;
font-weight:1000!important;
letter-spacing:.015em;
text-transform:uppercase;
}

.online{
display:inline-flex!important;
align-items:center;
justify-content:center;
padding:12px 18px!important;
border-radius:999px!important;
background:rgba(92,255,157,.12)!important;
border:1px solid rgba(92,255,157,.24)!important;
color:var(--success)!important;
font-size:13px!important;
font-weight:1000!important;
letter-spacing:.06em;
}

.stats,.core-grid{
display:grid!important;
grid-template-columns:repeat(auto-fit,minmax(245px,1fr))!important;
gap:22px!important;
margin-bottom:28px!important;
}

.card,.core-card,.form-card,.order,.chat,.chat-users,.ticket-sidebar,.ticket-chat,.checkout-card,.wallet-box,.topup-card,.live-card,.invoice-card,.mobile-box,.ws-box,.api-box,.ecu-box{
background:
linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.022))!important;
border:1px solid var(--border)!important;
border-radius:30px!important;
box-shadow:var(--shadow)!important;
backdrop-filter:blur(18px)!important;
}

.card,.core-card,.form-card{
padding:30px!important;
}

.card h3,.core-card h3{
font-size:13px!important;
text-transform:uppercase!important;
letter-spacing:.10em!important;
color:var(--muted)!important;
margin-bottom:18px!important;
}

.big,.live-number,.wallet-balance,.invoice-total,.mobile-title{
font-size:48px!important;
font-weight:1000!important;
letter-spacing:-.04em;
line-height:1;
}

.big.red,.red,.live-number,.mobile-title{
color:var(--accent)!important;
text-shadow:0 0 32px rgba(227,6,19,.25);
}

.core-card p,.card p,.order p,.form-card p{
color:#bcbcbc!important;
line-height:1.75!important;
}

.notice{
padding:18px 22px!important;
margin:20px 0!important;
border-radius:22px!important;
background:rgba(92,255,157,.095)!important;
border:1px solid rgba(92,255,157,.20)!important;
color:#b7ffcf!important;
}

.error{
padding:18px 22px!important;
margin:20px 0!important;
border-radius:22px!important;
background:rgba(227,6,19,.12)!important;
border:1px solid rgba(227,6,19,.28)!important;
color:#ffb1b1!important;
}

input,select,textarea{
width:100%!important;
padding:16px 18px!important;
border-radius:18px!important;
border:1px solid rgba(255,255,255,.09)!important;
background:rgba(0,0,0,.34)!important;
color:#fff!important;
font-size:15px!important;
outline:none!important;
margin:10px 0 20px!important;
transition:.18s!important;
}

input:focus,select:focus,textarea:focus{
border-color:rgba(227,6,19,.50)!important;
box-shadow:0 0 0 4px rgba(227,6,19,.13)!important;
background:#0d0d0d!important;
}

label{
display:block!important;
color:#b4b4b4!important;
font-size:12px!important;
font-weight:1000!important;
text-transform:uppercase!important;
letter-spacing:.09em!important;
margin:16px 0 8px!important;
}

button,.btn{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
padding:15px 24px!important;
border-radius:18px!important;
background:linear-gradient(135deg,#e30613,#850008)!important;
color:#fff!important;
border:1px solid rgba(255,255,255,.08)!important;
font-weight:1000!important;
text-transform:uppercase!important;
letter-spacing:.04em;
text-decoration:none!important;
cursor:pointer!important;
box-shadow:0 14px 34px rgba(227,6,19,.28)!important;
transition:.18s!important;
}

button:hover,.btn:hover{
transform:translateY(-2px);
box-shadow:0 18px 42px rgba(227,6,19,.38)!important;
}

.btn.dark{
background:#151515!important;
box-shadow:none!important;
border:1px solid rgba(255,255,255,.10)!important;
}

.btn.small{
padding:10px 14px!important;
font-size:12px!important;
}

.order-table,.table,.vip-table{
width:100%!important;
border-collapse:collapse!important;
background:rgba(255,255,255,.035)!important;
border:1px solid var(--border)!important;
border-radius:28px!important;
overflow:hidden!important;
box-shadow:var(--shadow)!important;
backdrop-filter:blur(18px)!important;
}

.order-table th,.table th,.vip-table th{
padding:18px!important;
background:#151515!important;
color:#aaa!important;
text-align:left!important;
font-size:12px!important;
letter-spacing:.09em!important;
text-transform:uppercase!important;
}

.order-table td,.table td,.vip-table td{
padding:18px!important;
border-top:1px solid rgba(255,255,255,.055)!important;
color:#e9e9e9!important;
}

.status{
display:inline-flex!important;
align-items:center!important;
justify-content:center!important;
padding:8px 14px!important;
border-radius:999px!important;
font-size:12px!important;
font-weight:1000!important;
text-transform:uppercase!important;
letter-spacing:.045em!important;
}

.status.new{background:#222!important;color:#fff!important}
.status.paid{background:rgba(92,255,157,.13)!important;color:var(--success)!important}
.status.progress{background:rgba(255,193,79,.13)!important;color:var(--warning)!important}
.status.done{background:rgba(122,183,255,.13)!important;color:var(--blue)!important}
.status.cancelled{background:rgba(227,6,19,.14)!important;color:#ff8c8c!important}

.orders{
display:grid!important;
grid-template-columns:repeat(auto-fit,minmax(320px,1fr))!important;
gap:22px!important;
}

.order{
position:relative!important;
padding:26px!important;
overflow:hidden;
}

.order::before{
content:"";
position:absolute;
top:0;
left:0;
height:100%;
width:5px;
background:linear-gradient(180deg,#e30613,#530005);
box-shadow:0 0 24px rgba(227,6,19,.45);
}

.order h2{
font-size:22px!important;
margin-bottom:12px!important;
}

.dropzone,.drop-big{
border:2px dashed rgba(255,255,255,.11)!important;
border-radius:30px!important;
background:rgba(255,255,255,.025)!important;
padding:58px 28px!important;
text-align:center!important;
transition:.18s!important;
}

.dropzone:hover,.dropzone.dragover,.drop-big:hover{
border-color:rgba(227,6,19,.42)!important;
background:rgba(227,6,19,.045)!important;
}

.timeline{
display:flex!important;
gap:12px!important;
flex-wrap:wrap!important;
margin:24px 0!important;
}

.timeline .step,.timeline-step{
padding:12px 18px!important;
border-radius:999px!important;
background:#151515!important;
border:1px solid rgba(255,255,255,.08)!important;
font-size:12px!important;
font-weight:1000!important;
letter-spacing:.07em!important;
}

.timeline .active,.timeline-step.active{
background:linear-gradient(135deg,#e30613,#850008)!important;
box-shadow:0 12px 30px rgba(227,6,19,.25)!important;
color:#fff!important;
}

.panel-lang-switcher,.wp-core-lang,.wp-lang-switcher{
background:rgba(10,10,10,.86)!important;
border:1px solid rgba(255,255,255,.14)!important;
box-shadow:0 14px 44px rgba(0,0,0,.45)!important;
backdrop-filter:blur(16px)!important;
}

/* chat */
.messages{
scroll-behavior:smooth;
}

.msg{
border-radius:18px!important;
padding:15px 18px!important;
line-height:1.6!important;
}

.msg.client{
background:rgba(255,255,255,.055)!important;
border:1px solid rgba(255,255,255,.07)!important;
}

.msg.admin{
background:linear-gradient(135deg,#e30613,#850008)!important;
box-shadow:0 12px 30px rgba(227,6,19,.20)!important;
}

/* landing header if present */
.home-header{
background:rgba(7,7,7,.82)!important;
backdrop-filter:blur(20px)!important;
border-bottom:1px solid var(--border)!important;
}

.hero-premium{
background:
radial-gradient(circle at top right,rgba(227,6,19,.18),transparent 36%),
linear-gradient(180deg,#111,#060606)!important;
border:1px solid var(--border)!important;
box-shadow:var(--shadow)!important;
}

.premium-card{
background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
border:1px solid var(--border)!important;
box-shadow:var(--shadow)!important;
}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#080808}
::-webkit-scrollbar-thumb{background:#2b2b2b;border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:#3a3a3a}

@media(max-width:1000px){
.layout{display:block!important}
.sidebar{
position:relative!important;
width:100%!important;
height:auto!important;
min-height:auto!important;
padding:22px!important;
}
.main{
margin-left:0!important;
width:100%!important;
padding:18px!important;
}
.topbar-v2{
flex-direction:column!important;
align-items:flex-start!important;
padding:22px!important;
}
.topbar-v2 h1{font-size:28px!important}
.stats,.core-grid,.orders{grid-template-columns:1fr!important}
button,.btn{width:100%!important}
.logo{margin-bottom:28px!important}
}


/* WP CSS Brand Logo System */
@import url('/assets/wp-brand-logo.css');

@import url('/assets/panels-logo-sync.css');

@import url('/assets/home-link-fix.css');

@import url('/assets/visible-menu-update.css');