:root{

    --bg:#0f172a;
    --card:#1e293b;
    --border:#334155;
    --primary:#2563eb;
    --text:#f8fafc;

}

body{

    background:var(--bg);
    color:var(--text);
    font-family:'Segoe UI',sans-serif;

}

.navbar-custom{

    background:#111827;

    border-bottom:1px solid var(--border);

}

.card-dashboard{

    background:var(--card);

    border:1px solid var(--border);

    border-radius:16px;

    padding:10px;

    height:100%;

    transition:.2s;
}

.card-dashboard:hover{

    transform:translateY(-2px);

}

.card-dashboard small{

    color:#94a3b8;

    text-transform:uppercase;

}

.card-dashboard h2{

    margin-top:10px;

    font-size:32px;

    font-weight:700;

}

.table-dark-custom{

    background:var(--card);

    border-radius:16px;

    overflow:hidden;

    border:1px solid var(--border);

}

.offcanvas{

    background:#111827;

    color:white;

}

.offcanvas a{

    color:white;

    text-decoration:none;

    display:block;

    padding:12px;

    border-radius:10px;

}

.offcanvas a:hover{

    background:#1e293b;

}

.content{

    padding:20px;
}

.app-wrapper{
    padding: 20px;
    margin-left: 0;
}

/* Desktop: dá sensação de sistema grande */
@media(min-width: 992px){

    .app-wrapper{
        padding: 25px 30px;
    }
}

.conexao-info{
    font-size: 12.5px;
    color: #2b2b2b;
    line-height: 1.5;
}

.conexao-info b{
    color: #111;
}

.small-card {
    padding: 10px;
    margin-bottom: 10px;
    border-radius: 6px;
    font-size: 13px;
}

.small-card h3 {
    font-size: 14px;
    margin-bottom: 8px;
}