:root{
  --blue600:#2563EB; --blue500:#3B82F6;
  --slate50:#F8FAFC; --slate100:#F1F5F9; --slate200:#E2E8F0; --slate500:#64748B; --slate700:#334155; --slate900:#0F172A;
  --green500:#16A34A; --green600:#15803D; --orange500:#F97316; --orange600:#EA580C;
  --greenBg:#DCFCE7; --greenText:#166534;
  --blueBg:#DBEAFE; --blueText:#1E40AF;
  --amberBg:#FEF3C7; --amberText:#92400E;
  --indigoBg:#E0E7FF; --indigoText:#3730A3;
  --redBg:#FEE2E2; --redText:#991B1B;
}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial;color:var(--slate900);background:#fff}
.topbar{height:56px;border-bottom:1px solid var(--slate200);display:flex;align-items:center;justify-content:space-between;padding:0 16px;position:sticky;top:0;background:#fff;z-index:40}
.top-left{display:flex;align-items:center;gap:12px}
.menu-toggle{display:none;background:transparent;border:none;cursor:pointer;padding:8px;border-radius:8px;color:var(--slate700)}
.menu-toggle:hover{background:var(--slate100)}
.menu-toggle svg{width:24px;height:24px}
.logo{border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.12);overflow:hidden;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:var(--blue600);color:#fff;font-weight:700;flex-shrink:0}
.topbar-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.top-right{display:flex;align-items:center;gap:12px;flex-shrink:0}
.notif{position:relative;cursor:pointer}
.notif .badge{position:absolute;top:-6px;right:-6px;font-size:10px;padding:2px 6px;background:#dc2626;color:#fff;border-radius:9999px;min-width:18px;text-align:center}
.avatar{width:28px;height:28px;border-radius:9999px;background:#dbeafe;display:flex;align-items:center;justify-content:center;color:#1d4ed8;flex-shrink:0}
.layout{display:grid;grid-template-columns:240px 1fr;min-height:calc(100vh - 56px);position:relative}
.sidebar{border-right:1px solid var(--slate200);padding:16px;background:#fff;overflow-y:auto;transition:transform .3s ease;position:relative}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:30;transition:opacity .3s}
.sidebar-overlay.active{display:block}
.side-btn{width:100%;text-align:left;padding:10px 12px;border-radius:12px;margin-bottom:6px;border:none;background:transparent;color:#475569;font-weight:600;cursor:pointer;font-size:14px;transition:all .2s}
.side-btn.disabled{opacity:.5;cursor:not-allowed}
.side-btn.active{background:var(--blueBg);color:var(--blueText)}
main{padding:24px;overflow-x:hidden}
h2{margin:0 0 4px;font-size:20px}
.muted{color:var(--slate500);font-size:13px}
.card{border:1px solid var(--slate200);border-radius:16px;padding:16px;background:#fff}
.grid{display:grid;gap:8px}
.grid-6{grid-template-columns:repeat(6,minmax(0,1fr))}
.filters{display:flex;gap:12px;align-items:stretch;justify-content:space-between;flex-wrap:wrap}
.search{position:relative;flex:1;min-width:200px}
.search input{width:100%;padding:10px 12px 10px 34px;border:1px solid var(--slate200);border-radius:12px;font-size:14px}
.chip{border-radius:9999px;padding:6px 10px;border:1px solid var(--slate200);background:#fff;font-size:13px;cursor:pointer;white-space:nowrap}
.chip.active{background:#dbeafe;color:#1e40af;border-color:#bfdbfe}
.btn{padding:8px 12px;border:1px solid var(--slate200);border-radius:12px;background:#fff;cursor:pointer;font-weight:600;color:var(--slate700);font-size:14px;white-space:nowrap;transition:all .2s}
.btn:hover{background:#f8fafc}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-green{background:var(--green500);color:#fff;border-color:transparent}
.btn-green:hover{background:var(--green600)}
.btn-orange{background:var(--orange500);color:#fff;border-color:transparent}
.btn-orange:hover{background:var(--orange600)}
.table-wrapper{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table{overflow:hidden;border:1px solid var(--slate200);border-radius:16px;min-width:100%}
table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;min-width:800px}
thead{background:linear-gradient(90deg,var(--blue600),var(--blue500));color:#fff}
th{padding:12px 16px;text-align:left;font-weight:600;white-space:nowrap}
th button{background:transparent;color:#fff;border:none;font-weight:700;display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:14px}
td{padding:12px 16px;border-top:1px solid var(--slate200);white-space:nowrap}
.pill{display:inline-block;padding:4px 10px;border-radius:9999px;font-weight:700;font-size:12px;white-space:nowrap}
.status-APROVADO{background:var(--greenBg);color:var(--greenText)}
.status-EM\ ANÁLISE{background:var(--blueBg);color:var(--blueText)}
.status-PENDENTE{background:var(--amberBg);color:var(--amberText)}
.status-CONTRATO\ ENVIADO{background:var(--indigoBg);color:var(--indigoText)}
.status-REPROVADO{background:var(--redBg);color:var(--redText)}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:10px;border:1px solid var(--slate200);background:#fff;cursor:pointer;flex-shrink:0}
.icon-btn:hover{background:#f8fafc}
.row-hover:hover{background:#f8fafc}
.pagination{display:flex;align-items:center;justify-content:space-between;margin-top:8px;flex-wrap:wrap;gap:8px}
.drawer{position:fixed;right:0;top:0;height:100vh;width:360px;max-width:90vw;background:#fff;box-shadow:-8px 0 24px rgba(0,0,0,.08);transform:translateX(100%);transition:transform .25s;z-index:50;overflow-y:auto}
.drawer.open{transform:translateX(0)}
/* Cadastro */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field label{display:block;font-size:12px;color:var(--slate500);margin-bottom:6px;font-weight:500}
.input, .select, textarea{width:100%;padding:10px 12px;border:1px solid var(--slate200);border-radius:12px;font-size:14px;font-family:inherit;resize:vertical}
.input:focus, .select:focus, textarea:focus{outline:none;border-color:var(--blue500);box-shadow:0 0 0 3px rgba(59,130,246,.1)}
.actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;flex-wrap:wrap}
/* Login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(#fff,#F8FAFC);padding:24px}
.login-card{width:100%;max-width:360px;background:#fff;border:1px solid var(--slate200);border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.06);padding:20px}
.login-logo{width:56px;height:56px;margin:0 auto;border-radius:14px;background:var(--blue600);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(37,99,235,.35);color:#fff;font-weight:700}
.login-input{width:100%;padding:10px 12px;border:1px solid var(--slate200);border-radius:12px;font-size:14px;font-family:inherit}
.login-input:focus{outline:none;border-color:var(--blue500);box-shadow:0 0 0 3px rgba(59,130,246,.1)}
.login-button{width:100%;padding:10px 12px;border:none;border-radius:12px;background:var(--blue600);color:#fff;font-weight:600;cursor:pointer;font-size:14px;transition:background .2s}
.login-button:hover{background:var(--blue500)}
.toast{position:fixed;right:16px;bottom:16px;left:16px;max-width:400px;margin-left:auto;background:#0f172a;color:#fff;padding:10px 14px;border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.2);opacity:0;transform:translateY(10px);transition:all .25s;z-index:60}
.toast.show{opacity:1;transform:translateY(0)}
/* User Menu */
.user-menu-btn{display:flex;align-items:center;gap:6px;background:transparent;border:none;cursor:pointer;padding:4px 8px;border-radius:8px;transition:background .2s}
.user-menu-btn:hover{background:#f8fafc}
.user-menu-btn span{font-size:14px;font-weight:600;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-menu-dropdown{position:absolute;right:0;top:calc(100% + 8px);background:#fff;border:1px solid var(--slate200);border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.1);min-width:200px;z-index:100;overflow:hidden}
.user-menu-item{display:flex;align-items:center;gap:10px;padding:10px 14px;color:var(--slate700);text-decoration:none;font-size:14px;transition:background .2s;border-bottom:1px solid var(--slate100)}
.user-menu-item:last-child{border-bottom:none}
.user-menu-item:hover{background:var(--slate50)}
.user-menu-item svg{flex-shrink:0}
.user-menu-item:last-child{color:#dc2626}
.user-menu-item:last-child:hover{background:#fee2e2}
.user-menu-dropdown.show{display:block}
.user-menu-btn.active #userMenuArrow{transform:rotate(180deg)}
/* SLA */
.sla-alert{color:#dc2626!important}
.sla-warning{color:#d97706!important}

/* Responsividade - Tablet */
@media (max-width: 1024px) {
  .layout{grid-template-columns:200px 1fr}
  .sidebar{width:200px}
  .grid-6{grid-template-columns:repeat(3,minmax(0,1fr))}
  main{padding:16px}
  .filters{flex-direction:column}
  .search{min-width:100%}
}

/* Responsividade - Mobile */
@media (max-width: 768px) {
  .topbar{padding:0 12px}
  .topbar-title{display:none}
  .menu-toggle{display:block}
  .layout{grid-template-columns:1fr}
  .sidebar{position:fixed;left:0;top:56px;height:calc(100vh - 56px);width:240px;transform:translateX(-100%);z-index:35;box-shadow:2px 0 8px rgba(0,0,0,.1)}
  .sidebar.open{transform:translateX(0)}
  .sidebar-overlay.active{display:block}
  main{padding:12px}
  h2{font-size:18px}
  .card{padding:12px}
  .grid-6{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filters{flex-direction:column;gap:8px}
  .search{min-width:100%}
  .search input{font-size:16px}
  .chip{font-size:12px;padding:5px 8px}
  .btn{font-size:13px;padding:6px 10px}
  .table-wrapper{overflow-x:auto;margin:0 -12px;padding:0 12px}
  table{font-size:13px;min-width:700px}
  th,td{padding:8px 12px;font-size:13px}
  .pagination{flex-direction:column;align-items:stretch;gap:12px}
  .pagination > div{display:flex;justify-content:center;gap:8px}
  .form-grid{grid-template-columns:1fr}
  .actions{flex-direction:column-reverse}
  .actions .btn{width:100%}
  .drawer{width:100%;max-width:100vw}
  .user-menu-btn span{max-width:80px}
  .user-menu-dropdown{right:-8px;min-width:180px}
  .toast{right:12px;left:12px;max-width:none}
}

/* Mobile pequeno */
@media (max-width: 480px) {
  .topbar{height:52px;padding:0 8px}
  .top-right{gap:8px}
  .notif{display:none}
  .avatar{width:24px;height:24px}
  .user-menu-btn span{display:none}
  .grid-6{grid-template-columns:1fr}
  .card{padding:10px}
  .filters{gap:6px}
  .btn{font-size:12px;padding:6px 8px}
  .chip{font-size:11px;padding:4px 6px}
  table{min-width:600px;font-size:12px}
  th,td{padding:6px 8px}
  .pill{font-size:11px;padding:3px 8px}
  .icon-btn{width:28px;height:28px}
  main{padding:8px}
  h2{font-size:16px}
  .login-card{padding:16px}
}

/* Ajustes para impressão */
@media print {
  .topbar,.sidebar,.filters,.pagination,.btn{display:none!important}
  .layout{grid-template-columns:1fr}
  main{padding:0}
  .table{box-shadow:none;border:none}
  table{border:1px solid #000}
  th,td{border:1px solid #000}
}