*{box-sizing:border-box}
:root{
    --red:#e50914;
    --red2:#9b0008;
    --black:#050505;
    --black2:#0b0b0b;
    --card:#111315;
    --silver:#d1d5db;
    --muted:#a3a3a3;
    --border:rgba(255,255,255,.08);
    --green:#22c55e;
}
body{
    margin:0;
    font-family:Arial,Helvetica,sans-serif;
    color:#fff;
    background:radial-gradient(circle at top right,rgba(229,9,20,.13),transparent 35%),#050505;
}
.app{display:flex;min-height:100vh}
.sidebar{
    width:280px;
    background:linear-gradient(180deg,#030303,#0d0d0d 55%,#050505);
    border-right:1px solid rgba(229,9,20,.25);
    position:fixed;top:0;bottom:0;left:0;
    padding:18px;
    overflow-y:auto;
    z-index:20;
    box-shadow:14px 0 45px rgba(0,0,0,.55);
    transition:.3s;
}
.brand{
    border:1px solid rgba(229,9,20,.22);
    background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(229,9,20,.08));
    border-radius:18px;
    padding:12px;
    margin-bottom:20px;
    text-align:center;
}
.brand img{width:100%;max-width:210px;border-radius:12px}
.menu-link,.submenu-btn{
    width:100%;
    border:0;
    background:transparent;
    color:#d4d4d8;
    padding:13px 14px;
    border-radius:13px;
    margin-bottom:7px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    text-decoration:none;
    cursor:pointer;
    font-size:15px;
    transition:.25s;
}
.menu-link:hover,.submenu-btn:hover{
    background:linear-gradient(90deg,rgba(229,9,20,.32),rgba(255,255,255,.03));
    color:#fff;
}
.submenu{max-height:0;overflow:hidden;transition:max-height .3s ease;padding-left:12px}
.submenu.open{max-height:360px}
.submenu a{
    display:block;
    color:#c9c9ce;
    text-decoration:none;
    padding:11px 14px;
    border-radius:10px;
    margin:4px 0;
    font-size:14px;
    border-left:2px solid rgba(229,9,20,.5);
}
.submenu a:hover{background:rgba(229,9,20,.18);color:#fff}
.submenu-btn b{transition:.25s}.submenu-btn.active b{transform:rotate(180deg)}
.logout{color:#fecaca}
.main{
    margin-left:280px;
    width:calc(100% - 280px);
    min-height:100vh;
    padding:26px;
    background:
        radial-gradient(circle at 82% 8%,rgba(229,9,20,.14),transparent 28%),
        linear-gradient(135deg,#070707,#0d1113 52%,#050505);
}
.mobile-top{display:none;height:58px;background:#050505;color:#fff;align-items:center;gap:14px;padding:0 16px;border-bottom:1px solid rgba(229,9,20,.3)}
.hamburger{border:0;background:var(--red);color:#fff;border-radius:10px;padding:8px 12px;font-size:20px}
.topbar{
    background:linear-gradient(180deg,rgba(20,22,24,.96),rgba(10,10,10,.96));
    border:1px solid var(--border);
    border-radius:24px;
    padding:22px 24px;
    margin-bottom:22px;
    box-shadow:0 20px 50px rgba(0,0,0,.45),0 0 24px rgba(229,9,20,.06);
    display:flex;justify-content:space-between;align-items:center;gap:14px;
}
.topbar h1{margin:0;font-size:28px}.topbar p{margin:7px 0 0;color:var(--muted)}
.grid-cards{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:16px;margin-bottom:22px}
.card{
    background:linear-gradient(180deg,#151719,#0c0c0c);
    border:1px solid var(--border);
    border-radius:22px;
    padding:22px;
    box-shadow:0 20px 45px rgba(0,0,0,.38);
    position:relative;
    overflow:hidden;
    transition:.25s;
}
.card:hover{transform:translateY(-3px);box-shadow:0 22px 50px rgba(0,0,0,.5),0 0 25px rgba(229,9,20,.12)}
.card:before{content:"";position:absolute;left:0;top:0;width:5px;height:100%;background:linear-gradient(180deg,#ff1a1a,#850000)}
.card span{color:var(--muted);font-size:13px;text-transform:uppercase;letter-spacing:.04em}
.card strong{display:block;margin-top:10px;font-size:27px;color:#fff}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:7px;
    border:0;
    background:linear-gradient(135deg,var(--red),var(--red2));
    color:#fff;
    padding:11px 15px;
    border-radius:13px;
    text-decoration:none;
    cursor:pointer;
    font-weight:700;
    font-size:14px;
    transition:.25s;
    box-shadow:0 10px 26px rgba(229,9,20,.22);
}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 22px rgba(229,9,20,.32)}
.btn.secondary{background:linear-gradient(135deg,#3f3f46,#18181b);box-shadow:none}
.btn.danger{background:linear-gradient(135deg,#dc2626,#7f1d1d)}
.btn.success{background:linear-gradient(135deg,#16a34a,#14532d)}
.table-wrap,.form-card{
    background:linear-gradient(180deg,rgba(18,20,22,.98),rgba(9,9,9,.98));
    border:1px solid var(--border);
    border-radius:24px;
    padding:20px;
    box-shadow:0 20px 50px rgba(0,0,0,.42);
    overflow-x:auto;
}
table{width:100%;border-collapse:collapse}
th{background:#191b1d;color:#fff;text-align:left}
th,td{padding:13px;border-bottom:1px solid rgba(255,255,255,.07);font-size:14px}
td{color:#e5e7eb}
.form-grid{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:16px}
.form-group{display:flex;flex-direction:column}.form-group.full{grid-column:1/-1}
label{font-weight:bold;margin-bottom:7px;font-size:14px;color:#f4f4f5}
input,select,textarea{
    background:#090909;
    border:1px solid #2f2f32;
    color:#fff;
    border-radius:13px;
    padding:12px;
    width:100%;
    font-size:14px;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(229,9,20,.15)}
textarea{min-height:95px}
.badge{padding:6px 10px;border-radius:999px;background:rgba(229,9,20,.15);border:1px solid rgba(229,9,20,.34);color:#fecaca;font-size:12px}
.alert{padding:13px 16px;border-radius:13px;margin-bottom:16px}
.alert.success{background:rgba(34,197,94,.13);border:1px solid rgba(34,197,94,.3);color:#bbf7d0}
.alert.error{background:rgba(220,38,38,.15);border:1px solid rgba(220,38,38,.32);color:#fecaca}
.vehicle-img{width:82px;height:56px;object-fit:cover;border-radius:14px;background:#090909;border:1px solid rgba(255,255,255,.1)}
.profit-positive{color:#86efac;font-weight:bold}.profit-negative{color:#fca5a5;font-weight:bold}

/* LOGIN ULTRA PREMIUM */
.login-body{
    min-height:100vh;
    background:
        linear-gradient(rgba(0,0,0,.72),rgba(0,0,0,.86)),
        url('../img/logo-agape.jpeg');
    background-size:cover;
    background-position:center;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
}
.login-overlay{width:100%;display:flex;justify-content:center;align-items:center}
.login-left{width:100%;max-width:480px}
.login-logo-box{text-align:center;margin-bottom:22px}
.login-logo-box img{width:100%;max-width:345px;border-radius:16px}
.login-card-premium{
    background:rgba(8,8,8,.90);
    border:1px solid rgba(229,9,20,.28);
    border-radius:26px;
    padding:34px;
    backdrop-filter:blur(12px);
    box-shadow:0 0 35px rgba(229,9,20,.16),0 25px 70px rgba(0,0,0,.65);
}
.login-card-premium h2{margin:0;font-size:27px;text-align:center}
.login-card-premium p{text-align:center;color:#a3a3a3;margin:9px 0 24px}
.btn-login{width:100%;padding:14px;margin-top:12px;font-size:16px}
.login-footer{text-align:center;color:#aaa;font-size:12px;margin-top:18px}

.preview-logo-box{background:#050505;border:1px dashed rgba(229,9,20,.6);border-radius:18px;padding:18px;margin-bottom:20px;display:flex;justify-content:center}
.preview-logo-box img{max-width:360px;width:100%;border-radius:14px}
.print-area{background:#fff;color:#000;padding:30px;border-radius:12px}
.print-area *{color:#000!important}
.print-header{text-align:center;border-bottom:2px solid #111;padding-bottom:12px;margin-bottom:18px}
.parcela{border:1px dashed #333;padding:14px;margin-bottom:12px;border-radius:8px}
small{color:var(--muted);margin-top:6px}

@media print{
    .sidebar,.mobile-top,.actions,.btn{display:none!important}
    .main{margin:0;width:100%;padding:0;background:#fff}
    body{background:#fff}
    .print-area,.table-wrap,.form-card,.topbar{box-shadow:none;border-radius:0}
}
@media(max-width:980px){
    .mobile-top{display:flex;position:sticky;top:0;z-index:30}
    .sidebar{transform:translateX(-105%)}
    .sidebar.show{transform:translateX(0)}
    .main{margin-left:0;width:100%;padding:16px}
    .grid-cards,.form-grid{grid-template-columns:1fr}
    .topbar{display:block}
}


.preview-veiculo-form {
    width: 100%;
    max-width: 260px;
    height: 150px;
    object-fit: cover;
    border-radius: 16px;
    border: 1px solid rgba(229,9,20,.35);
    background: #090909;
    box-shadow: 0 12px 30px rgba(0,0,0,.35);
}


/* RELATÓRIOS PROFISSIONAIS */
.report-print-area {
    background: linear-gradient(180deg, rgba(18,20,22,.98), rgba(9,9,9,.98));
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 24px;
    padding: 24px;
    box-shadow: 0 20px 50px rgba(0,0,0,.42);
}

.report-header {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    border-bottom: 1px solid rgba(229,9,20,.35);
    padding-bottom: 18px;
    margin-bottom: 18px;
}

.report-company {
    display: flex;
    align-items: center;
    gap: 16px;
}

.report-company img {
    width: 135px;
    max-height: 78px;
    object-fit: contain;
    background: #050505;
    border-radius: 12px;
    border: 1px solid rgba(229,9,20,.25);
    padding: 6px;
}

.report-company h2,
.report-title h1 {
    margin: 0;
    color: #fff;
}

.report-company p,
.report-title p {
    margin: 4px 0;
    color: #a3a3a3;
    font-size: 13px;
}

.report-title {
    text-align: right;
}

.report-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(150px, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.report-summary div {
    background: #0b0b0b;
    border: 1px solid rgba(229,9,20,.18);
    border-radius: 16px;
    padding: 14px;
}

.report-summary span {
    display: block;
    color: #a3a3a3;
    font-size: 12px;
    text-transform: uppercase;
}

.report-summary strong {
    display: block;
    margin-top: 7px;
    font-size: 20px;
    color: #fff;
}

.report-footer {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid rgba(255,255,255,.08);
    padding-top: 18px;
    margin-top: 20px;
    color: #a3a3a3;
}

.report-table {
    box-shadow: none;
    border-radius: 18px;
}

.no-print {
    display: block;
}

@media(max-width: 980px) {
    .report-header,
    .report-footer {
        display: block;
    }

    .report-title {
        text-align: left;
        margin-top: 14px;
    }

    .report-summary {
        grid-template-columns: 1fr;
    }
}

@media print {
    @page {
        size: A4 portrait;
        margin: 10mm;
    }

    body {
        background: #fff !important;
        color: #000 !important;
    }

    .no-print,
    .sidebar,
    .mobile-top,
    .actions,
    .btn {
        display: none !important;
    }

    .main {
        margin: 0 !important;
        width: 100% !important;
        padding: 0 !important;
        background: #fff !important;
    }

    .report-print-area {
        background: #fff !important;
        color: #000 !important;
        border: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
        border-radius: 0 !important;
    }

    .report-header {
        border-bottom: 2px solid #000 !important;
    }

    .report-company img {
        border: 1px solid #ccc !important;
        background: #fff !important;
    }

    .report-company h2,
    .report-title h1,
    .report-summary strong,
    .report-print-area * {
        color: #000 !important;
    }

    .report-company p,
    .report-title p,
    .report-summary span,
    .report-footer {
        color: #333 !important;
    }

    .report-summary {
        grid-template-columns: repeat(5, 1fr) !important;
    }

    .report-summary div {
        background: #f5f5f5 !important;
        border: 1px solid #ccc !important;
        padding: 8px !important;
    }

    .table-wrap,
    .report-table {
        background: #fff !important;
        border: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
    }

    table {
        width: 100% !important;
        border-collapse: collapse !important;
        font-size: 11px !important;
    }

    th {
        background: #e5e5e5 !important;
        color: #000 !important;
        border: 1px solid #999 !important;
    }

    td {
        color: #000 !important;
        border: 1px solid #bbb !important;
    }

    th, td {
        padding: 6px !important;
    }

    tfoot th {
        background: #d8d8d8 !important;
        font-weight: bold !important;
    }

    .report-footer {
        border-top: 1px solid #999 !important;
    }

    small {
        color: #333 !important;
    }
}


.termo-documento {
    font-size: 15px;
    line-height: 1.65;
}

.termo-documento h3 {
    margin-top: 24px;
    border-bottom: 1px solid #333;
    padding-bottom: 6px;
}