:root{
--dark:#151719;
--dark2:#202428;
--yellow:#f5b51b;
--yellow2:#ffd45a;
--bg:#f3f5f7;
--white:#fff;
--text:#17191c;
--muted:#737b84;
--border:#e5e8eb;
--green:#1f9d68;
--red:#d94b4b;
}

*{box-sizing:border-box}

html,body{
margin:0!important;
padding:0!important;
font-family:Inter,Arial,sans-serif!important;
background:var(--bg)!important;
color:var(--text)!important;
}

nav{
height:68px!important;
background:var(--dark)!important;
color:#fff!important;
padding:0 22px!important;
display:flex!important;
align-items:center!important;
justify-content:space-between!important;
box-shadow:0 3px 15px #0002!important;
}

.logo{
color:#fff!important;
font-size:19px!important;
font-weight:900!important;
letter-spacing:.4px!important;
}

.navlinks{
display:flex!important;
gap:6px!important;
}

.navlinks a{
color:#dfe3e7!important;
padding:9px 12px!important;
border-radius:8px!important;
}

.navlinks a:hover{
background:#ffffff12!important;
color:#fff!important;
}

.shell{
min-height:calc(100vh - 68px)!important;
background:var(--bg)!important;
}

aside{
background:var(--dark)!important;
border:0!important;
padding:14px!important;
}

aside a,aside button{
color:#cfd4d9!important;
background:transparent!important;
border:0!important;
border-radius:9px!important;
padding:12px 13px!important;
margin-bottom:4px!important;
text-align:left!important;
}

aside a:hover,aside button:hover{
background:#ffffff12!important;
color:#fff!important;
}

.main{
padding:24px!important;
background:var(--bg)!important;
}

h1{
margin:0 0 22px!important;
font-size:30px!important;
font-weight:850!important;
letter-spacing:-.6px!important;
}

h2{
font-weight:800!important;
}

.cards{
display:grid!important;
grid-template-columns:repeat(4,minmax(0,1fr))!important;
gap:15px!important;
}

.card,.stat,.form{
background:#fff!important;
border:1px solid var(--border)!important;
border-radius:14px!important;
padding:19px!important;
box-shadow:0 4px 15px #00000008!important;
}

.card:hover{
border-color:#d8dde2!important;
}

.card .label,.card small{
color:var(--muted)!important;
font-size:12px!important;
font-weight:700!important;
text-transform:uppercase!important;
letter-spacing:.4px!important;
}

.card .value{
display:block!important;
margin-top:8px!important;
font-size:27px!important;
font-weight:850!important;
}

.field label,.form label{
font-size:12px!important;
font-weight:800!important;
color:#59616a!important;
margin-bottom:5px!important;
}

input,select,textarea{
border:1px solid #d9dee3!important;
border-radius:8px!important;
background:#fff!important;
padding:11px 12px!important;
color:var(--text)!important;
}

input:focus,select:focus,textarea:focus{
outline:none!important;
border-color:var(--yellow)!important;
box-shadow:0 0 0 3px #f5b51b22!important;
}

button,.primary{
border:0!important;
border-radius:8px!important;
background:var(--dark)!important;
color:#fff!important;
font-weight:800!important;
padding:11px 16px!important;
}

button:hover,.primary:hover{
background:#000!important;
}

table{
background:#fff!important;
border:1px solid var(--border)!important;
border-radius:12px!important;
box-shadow:0 4px 15px #00000008!important;
overflow:hidden!important;
}

th{
background:#202428!important;
color:#fff!important;
font-size:12px!important;
font-weight:800!important;
padding:12px!important;
}

td{
padding:11px!important;
border-bottom:1px solid #edf0f2!important;
}

tr:hover td{
background:#fafbfc!important;
}

.toolbar{
background:#fff!important;
border:1px solid var(--border)!important;
border-radius:12px!important;
padding:12px!important;
box-shadow:0 4px 15px #00000008!important;
}

.login{
min-height:100vh!important;
background:linear-gradient(135deg,#111315 0%,#202428 55%,#111315 100%)!important;
display:flex!important;
align-items:center!important;
justify-content:center!important;
padding:20px!important;
}

.loginbox{
width:min(410px,100%)!important;
background:#fff!important;
border:0!important;
border-radius:18px!important;
padding:30px!important;
box-shadow:0 25px 70px #0008!important;
}

.loginbox h2{
font-size:25px!important;
margin-bottom:6px!important;
}

.loginbox h2::before{
content:"⚙ ";
color:var(--yellow)!important;
}

.loginbox p{
color:var(--muted)!important;
}

.loginbox .primary{
width:100%!important;
margin-top:5px!important;
padding:13px!important;
background:var(--dark)!important;
}

@media(max-width:1000px){
.cards{
grid-template-columns:repeat(2,minmax(0,1fr))!important;
}
}

@media(max-width:850px){
nav{
padding:10px 14px!important;
flex-wrap:wrap!important;
height:auto!important;
min-height:64px!important;
}

.navlinks{
width:100%!important;
overflow-x:auto!important;
}

.navlinks a{
white-space:nowrap!important;
}

.shell{
display:block!important;
}

aside{
display:flex!important;
overflow-x:auto!important;
gap:5px!important;
}

aside a,aside button{
min-width:max-content!important;
margin:0!important;
}

.main{
padding:15px!important;
}

h1{
font-size:25px!important;
}
}

@media(max-width:520px){
.cards{
grid-template-columns:1fr 1fr!important;
gap:10px!important;
}

.card{
padding:14px!important;
}

.card .value{
font-size:22px!important;
}

.main{
padding:12px!important;
}

.loginbox{
padding:24px 19px!important;
}
}
/* ===== TERCON NOVO VISUAL ===== */
:root{
--tercon-yellow:#f4b51f;
--tercon-dark:#121416;
--tercon-dark2:#1b1f24;
--tercon-bg:#f4f6f8;
--tercon-card:#fff;
--tercon-text:#17202a;
--tercon-muted:#667085;
--tercon-border:#e4e7ec;
}

html,body{
margin:0!important;
padding:0!important;
background:var(--tercon-bg)!important;
color:var(--tercon-text)!important;
font-family:Inter,Arial,Helvetica,sans-serif!important;
}

nav{
background:linear-gradient(135deg,#121416,#252a30)!important;
padding:0 28px!important;
min-height:76px!important;
box-shadow:0 4px 18px rgba(0,0,0,.18)!important;
}

.logo{
font-weight:900!important;
font-size:20px!important;
letter-spacing:.8px!important;
color:#fff!important;
}

.logo:before{content:"⚙ "!important}

.navlinks{gap:8px!important}

.navlinks a{
padding:10px 14px!important;
border-radius:10px!important;
font-weight:600!important;
color:#d5d7d9!important;
transition:.2s!important;
}

.navlinks a:hover{
background:rgba(255,255,255,.1)!important;
color:#fff!important;
}

.navlinks a[href="/admin/"]{
background:#f4b51f!important;
color:#121416!important;
}

.hero{
min-height:520px!important;
padding:70px 7%!important;
background:linear-gradient(135deg,#121416,#252a30)!important;
}

.hero h1{
font-weight:900!important;
color:#fff!important;
}

.hero .eyebrow{
color:#f4b51f!important;
font-weight:800!important;
letter-spacing:2px!important;
}

.hero p{
color:#d5d7d9!important;
line-height:1.7!important;
}

.btn.primary{
background:#f4b51f!important;
color:#121416!important;
font-weight:800!important;
border-radius:10px!important;
}

section{padding:65px 7%!important}

.title h2{
color:#121416!important;
font-weight:800!important;
}

.title p{
color:#667085!important;
}

.grid{
gap:18px!important;
}

.card{
background:#fff!important;
border:1px solid #e4e7ec!important;
border-radius:16px!important;
padding:24px!important;
box-shadow:0 8px 25px rgba(16,24,40,.08)!important;
transition:.2s!important;
}

.card:hover{
transform:translateY(-3px)!important;
box-shadow:0 14px 32px rgba(16,24,40,.12)!important;
}

.card h3{
color:#121416!important;
}

.card p{
color:#667085!important;
line-height:1.6!important;
}

footer{
background:#121416!important;
color:#98a2b3!important;
}

@media(max-width:800px){
nav{
padding:14px 18px!important;
flex-wrap:wrap!important;
}
.navlinks{
width:100%!important;
overflow-x:auto!important;
}
.hero{
padding:55px 22px!important;
min-height:470px!important;
}
section{
padding:50px 22px!important;
}
}
