* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --vermelho:#c41e2c;
  --vermelho-hover:#a01824;
  --azul-escuro:#1a365d;
  --azul-medio:#2c5282;
  --texto:#1a202c;
  --cinza:#f7fafc;
  --cinza-escuro:#718096;
  --borda:#e2e8f0;
  --branco:#ffffff;
  --sombra:0 2px 12px rgba(0,0,0,.08);
  --radius:10px;
  --font:'Montserrat','Segoe UI',sans-serif;
}
body { font-family:var(--font); background:var(--cinza); color:var(--texto); min-height:100vh; }
a { color:var(--azul-medio); text-decoration:none; }
a:hover { color:var(--vermelho); }

/* ======= LOGIN PAGES ======= */
.login-page {
  display:flex; align-items:center; justify-content:center; min-height:100vh;
  background:linear-gradient(135deg,var(--azul-escuro),var(--azul-medio));
  padding:20px;
}
.login-container { width:100%; max-width:420px; }
.login-card {
  background:var(--branco); border-radius:var(--radius);
  box-shadow:0 8px 40px rgba(0,0,0,.2); padding:40px 35px;
  animation:fadeInUp .5s ease;
}
.login-header { text-align:center; margin-bottom:30px; }
.login-logo {
  width:64px; height:64px; margin:0 auto 16px;
  background:var(--vermelho); border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  color:var(--branco);
}
.login-header h1 { font-size:1.4rem; font-weight:700; color:var(--azul-escuro); }
.login-header p { font-size:.85rem; color:var(--cinza-escuro); margin-top:4px; }

/* ======= FORMS ======= */
.form-group { margin-bottom:18px; }
.form-group label { display:block; font-size:.8rem; font-weight:600; color:var(--azul-escuro); margin-bottom:5px; text-transform:uppercase; letter-spacing:.5px; }
.form-control {
  width:100%; padding:12px 14px; font-size:.95rem; font-family:var(--font);
  border:2px solid var(--borda); border-radius:8px; transition:border-color .2s;
  background:var(--branco); color:var(--texto);
}
.form-control:focus { border-color:var(--vermelho); outline:none; box-shadow:0 0 0 3px rgba(196,30,44,.1); }
.btn {
  display:inline-flex; align-items:center; gap:6px; padding:12px 24px;
  font-size:.9rem; font-weight:600; font-family:var(--font);
  border:none; border-radius:8px; cursor:pointer; transition:all .2s;
  text-decoration:none;
}
.btn-primary { background:var(--vermelho); color:var(--branco); }
.btn-primary:hover { background:var(--vermelho-hover); transform:translateY(-1px); box-shadow:0 4px 12px rgba(196,30,44,.3); }
.btn-outline { background:transparent; color:var(--azul-medio); border:2px solid var(--borda); }
.btn-outline:hover { border-color:var(--vermelho); color:var(--vermelho); }
.btn-block { width:100%; justify-content:center; }
.btn-sm { padding:8px 16px; font-size:.8rem; }
.btn-secondary { background:var(--cinza); color:var(--texto); border:2px solid var(--borda); }
.btn-secondary:hover { border-color:var(--cinza-escuro); background:#edf2f7; }
.btn-danger { background:#e53e3e; color:var(--branco); }
.btn-danger:hover { background:#c53030; transform:translateY(-1px); box-shadow:0 4px 12px rgba(229,62,62,.3); }

/* ======= ALERTS ======= */
.alert { padding:12px 16px; border-radius:8px; font-size:.85rem; margin-bottom:16px; font-weight:500; }
.alert-success { background:#c6f6d5; color:#22543d; border:1px solid #9ae6b4; }
.alert-error { background:#fed7d7; color:#742a2a; border:1px solid #feb2b2; }
.alert-warning { background:#fefcbf; color:#744210; border:1px solid #f6e05e; }

/* ======= SYS HEADER ======= */
.sys-header {
  background:var(--azul-escuro); padding:0 20px;
  position:sticky; top:0; z-index:100;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
}
.sys-header-inner {
  max-width:1400px; margin:0 auto;
  display:flex; align-items:center; gap:30px; height:56px;
}
.sys-brand { font-size:1rem; font-weight:800; color:var(--branco); text-transform:uppercase; letter-spacing:2px; white-space:nowrap; }
.sys-brand span { color:var(--vermelho); }
.sys-nav { display:flex; gap:4px; flex:1; }
.sys-nav a {
  padding:6px 14px; font-size:.8rem; font-weight:500; color:rgba(255,255,255,.7);
  border-radius:6px; transition:all .2s; white-space:nowrap;
}
.sys-nav a:hover { color:var(--branco); background:rgba(255,255,255,.1); }
.sys-nav a.active { color:var(--branco); background:rgba(196,30,44,.6); }
.nav-logout { margin-left:auto; color:rgba(255,255,255,.5) !important; }
.nav-logout:hover { color:var(--vermelho) !important; background:rgba(196,30,44,.15) !important; }
.sys-user { font-size:.8rem; color:rgba(255,255,255,.6); padding:4px 12px; background:rgba(255,255,255,.08); border-radius:6px; white-space:nowrap; }

/* ======= SYS MAIN ======= */
.sys-main { max-width:1400px; margin:0 auto; padding:30px 20px; }
.page-header { margin-bottom:24px; }
.page-header h1 { font-size:1.6rem; font-weight:800; color:var(--azul-escuro); }
.page-header p { font-size:.9rem; color:var(--cinza-escuro); margin-top:3px; }

/* ======= STATS CARDS ======= */
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-bottom:24px; }
.stat-card {
  background:var(--branco); border-radius:var(--radius); padding:20px;
  box-shadow:var(--sombra); display:flex; align-items:center; gap:16px;
}
.stat-icon { width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stat-icon-blue { background:#ebf4ff; color:var(--azul-medio); }
.stat-icon-red { background:#fee2e2; color:var(--vermelho); }
.stat-info { display:flex; flex-direction:column; }
.stat-number { font-size:1.8rem; font-weight:800; color:var(--azul-escuro); line-height:1; }
.stat-label { font-size:.8rem; color:var(--cinza-escuro); margin-top:3px; }

/* ======= FORM ERRORS ======= */
.form-error { display:block; font-size:.78rem; color:#e53e3e; margin-top:4px; font-weight:500; }
/* ======= FORM ACTIONS ======= */
.form-actions { display:flex; gap:12px; margin-top:20px; }
.form { padding:20px; max-width:600px; }

/* ======= CARDS ======= */
.card { background:var(--branco); border-radius:var(--radius); box-shadow:var(--sombra); overflow:hidden; margin-bottom:20px; }
.card-header { padding:16px 20px; border-bottom:1px solid var(--borda); }
.card-header h2 { font-size:1rem; font-weight:700; color:var(--azul-escuro); }
.card-body { padding:20px; }
.card-body p { font-size:.9rem; color:var(--cinza-escuro); margin-bottom:8px; }

/* ======= TABLE ======= */
.table-wrap { overflow-x:auto; }
.table { width:100%; border-collapse:collapse; font-size:.85rem; }
.table th {
  background:var(--cinza); padding:10px 12px; text-align:left;
  font-weight:600; color:var(--azul-escuro); font-size:.78rem;
  text-transform:uppercase; letter-spacing:.5px; border-bottom:2px solid var(--borda);
  white-space:nowrap;
}
.table td { padding:10px 12px; border-bottom:1px solid var(--borda); color:var(--texto); }
.table tr:hover td { background:var(--cinza); }
.table .empty-row { text-align:center; padding:40px; color:var(--cinza-escuro); font-style:italic; }
.cell-placa { font-family:'Consolas','Courier New',monospace; font-size:.8rem; font-weight:500; white-space:nowrap; }
.cell-obs { max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ======= BADGES ======= */
.badge { display:inline-block; padding:3px 10px; border-radius:12px; font-size:.75rem; font-weight:600; }
.badge-warning { background:#fefcbf; color:#744210; }
.badge-ok { background:#c6f6d5; color:#22543d; }
.route-badge {
  display:inline-block; padding:2px 10px; border-radius:6px;
  background:var(--azul-escuro); color:var(--branco); font-size:.75rem; font-weight:600;
}
.total-badge { text-align:right; font-size:.9rem; color:var(--cinza-escuro); padding:12px 0; }
.total-badge strong { color:var(--azul-escuro); }

/* ======= TABLE ACTIONS ======= */
.actions-cell { white-space:nowrap; }
.actions-cell .btn { margin-right:4px; }
/* ======= SORTABLE HEADERS ======= */
.sortable { color:var(--azul-escuro); display:inline-flex; align-items:center; gap:4px; }
.sortable:hover { color:var(--vermelho); }

/* ======= FILTER BAR ======= */
.filter-bar { display:flex; gap:12px; align-items:end; flex-wrap:wrap; margin-bottom:20px; }
.filter-group { display:flex; flex-direction:column; gap:4px; }
.filter-group label { font-size:.75rem; font-weight:600; color:var(--cinza-escuro); text-transform:uppercase; letter-spacing:.3px; }
.filter-input { max-width:280px; }

/* ======= UPLOAD ZONE ======= */
.upload-zone {
  border:2px dashed var(--borda); border-radius:var(--radius);
  padding:40px 20px; text-align:center; cursor:pointer;
  transition:all .2s; margin-bottom:20px; position:relative;
  background:var(--cinza);
}
.upload-zone:hover { border-color:var(--vermelho); background:#fff5f5; }
.upload-zone svg { width:48px; height:48px; color:var(--cinza-escuro); margin-bottom:12px; }
.upload-zone p { font-size:.95rem; color:var(--texto); }
.upload-zone strong { color:var(--vermelho); }
.upload-hint { display:block; font-size:.8rem; color:var(--cinza-escuro); margin-top:6px; }
.file-input { display:none; }
.format-example {
  display:block; padding:12px 16px; background:var(--azul-escuro);
  color:#e2e8f0; border-radius:8px; font-size:.8rem; overflow-x:auto; margin-top:8px;
}
.back-link { display:block; text-align:center; margin-top:16px; font-size:.85rem; color:var(--cinza-escuro); }
.back-link:hover { color:var(--vermelho); }
.login-footer-text { text-align:center; font-size:.8rem; color:var(--cinza-escuro); margin-top:20px; line-height:1.6; }

/* ======= QUICK ACTIONS ======= */
.quick-actions { display:flex; gap:12px; margin-top:20px; flex-wrap:wrap; }

/* ======= RESPONSIVE ======= */
@media(max-width:768px) {
  .sys-header-inner { gap:12px; flex-wrap:wrap; height:auto; padding:10px 0; }
  .sys-nav { order:3; width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
  .sys-nav a { font-size:.75rem; padding:5px 10px; }
  .sys-user { display:none; }
  .sys-main { padding:20px 12px; }
  .page-header h1 { font-size:1.3rem; }
  .stats-grid { grid-template-columns:1fr; }
  .filter-bar { flex-direction:column; }
  .filter-input { max-width:100%; }
  .login-card { padding:28px 20px; }
  .table { font-size:.78rem; }
  .table th, .table td { padding:7px 8px; }
}
@media(max-width:480px) {
  .login-card { padding:24px 16px; }
  .sys-header-inner { gap:8px; }
  .sys-brand { font-size:.85rem; letter-spacing:1px; }
  .card-body { padding:14px; }
}

/* ======= ANIMATIONS ======= */
@keyframes fadeInUp {
  from { opacity:0; transform:translateY(20px); }
  to { opacity:1; transform:translateY(0); }
}


/* ======= PAGINATION ======= */
.pagination-bar {
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 20px; border-top:1px solid var(--borda);
  flex-wrap:wrap; gap:10px;
}
.pagination-info { font-size:.8rem; color:var(--cinza-escuro); }
.pagination-controls { display:flex; align-items:center; gap:8px; }
.pagination-controls label { font-size:.8rem; color:var(--cinza-escuro); white-space:nowrap; }
.pagination-controls select {
  padding:5px 8px; font-size:.8rem; font-family:var(--font);
  border:2px solid var(--borda); border-radius:6px;
  background:var(--branco); cursor:pointer;
}
.pagination-controls select:focus { border-color:var(--vermelho); outline:none; }
.pagination-links { display:flex; gap:8px; }
