:root{
  --bg:#0B0F1A;
  --panel:rgba(255,255,255,.04);
  --border:rgba(148,163,184,.14);
  --text:#E5E7EB;
  --muted:#94A3B8;
  --primary:#00E5FF;
  --accent:#7C4DFF;
}

.itap-bg{
  background:
    radial-gradient(1200px 600px at 15% 15%, rgba(124,77,255,.18), transparent 60%),
    radial-gradient(900px 500px at 85% 35%, rgba(0,229,255,.13), transparent 55%),
    radial-gradient(800px 500px at 40% 90%, rgba(0,200,83,.08), transparent 60%),
    linear-gradient(180deg, #070A12, var(--bg));
}

.itap-shell{
  background: transparent;
}

.itap-card{
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
}

.itap-chip{
  background: rgba(0,229,255,.10);
  border: 1px solid rgba(0,229,255,.25);
  color: rgba(255,255,255,.9);
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
}

.itap-badge{
  width: 44px; height: 44px;
  display:flex; align-items:center; justify-content:center;
  border-radius: 14px;
  font-weight: 700;
  color: #0B0F1A;
  background: linear-gradient(135deg, var(--primary), var(--accent));
  box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 18px 40px rgba(124,77,255,.24);
}

.itap-glow{
  background: radial-gradient(circle, rgba(124,77,255,.35), transparent 60%);
  filter: blur(8px);
}
.itap-glow2{
  background: radial-gradient(circle, rgba(0,229,255,.28), transparent 60%);
  filter: blur(10px);
}

.itap-btn{
  display:flex; align-items:center; justify-content:space-between;
  padding: 12px 14px;
  border-radius: 14px;
  color: white;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(135deg, rgba(124,77,255,.35), rgba(0,229,255,.20));
  transition: transform .15s ease, filter .15s ease;
}
.itap-btn:hover{ transform: translateY(-1px); filter: brightness(1.05); }

.itap-label{ display:block; font-size: 12px; color: var(--muted); margin-bottom: 6px; letter-spacing: .08em; text-transform: uppercase; }
.itap-input{
  width:100%;
  padding: 12px 12px;
  border-radius: 14px;
  color: white;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(148,163,184,.18);
  outline: none;
}
.itap-input:focus{ border-color: rgba(0,229,255,.45); box-shadow: 0 0 0 4px rgba(0,229,255,.08); }

.itap-layout{
  display:flex;
  min-height:100vh;
}
.itap-sidebar{
  width: 280px;
  position: sticky;
  top: 0;
  height: 100vh;
  padding: 18px;
}
.itap-main{
  flex:1;
  padding: 18px 18px 40px 18px;
}
.itap-nav a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 10px 12px;
  border-radius: 14px;
  color: rgba(226,232,240,.9);
  border: 1px solid transparent;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.itap-nav a:hover{
  background: rgba(255,255,255,.04);
  border-color: rgba(148,163,184,.14);
  transform: translateY(-1px);
}
.itap-nav a.active{
  background: linear-gradient(135deg, rgba(124,77,255,.20), rgba(0,229,255,.10));
  border-color: rgba(0,229,255,.20);
}
.itap-kpi{
  display:flex; flex-direction:column; gap:6px;
}
.itap-kpi .label{ color: rgba(148,163,184,.9); font-size: 12px; letter-spacing:.08em; text-transform:uppercase;}
.itap-kpi .value{ color: white; font-size: 22px; font-weight: 700;}
.itap-kpi .delta{ color: rgba(0,229,255,.9); font-size: 12px; }

.table-itap{
  width:100%;
  border-collapse: collapse;
}
.table-itap th{
  text-align:left;
  font-size: 12px;
  letter-spacing:.08em;
  text-transform: uppercase;
  color: rgba(148,163,184,.95);
  padding: 10px 12px;
  border-bottom: 1px solid rgba(148,163,184,.14);
}
.table-itap td{
  padding: 10px 12px;
  color: rgba(226,232,240,.92);
  border-bottom: 1px solid rgba(148,163,184,.10);
}
.itap-pill{
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  border:1px solid rgba(148,163,184,.18);
  background: rgba(255,255,255,.03);
}
.itap-pill.paid{ border-color: rgba(0,200,83,.35); background: rgba(0,200,83,.12); }
.itap-pill.sent{ border-color: rgba(0,229,255,.35); background: rgba(0,229,255,.10); }
.itap-pill.draft{ border-color: rgba(124,77,255,.35); background: rgba(124,77,255,.10); }
.itap-pill.overdue{ border-color: rgba(255,214,0,.35); background: rgba(255,214,0,.10); }
.itap-pill.void{ border-color: rgba(244,63,94,.35); background: rgba(244,63,94,.10); }
.itap-pill.accepted{ border-color: rgba(0,200,83,.35); background: rgba(0,200,83,.12); }
.itap-pill.rejected{ border-color: rgba(244,63,94,.35); background: rgba(244,63,94,.10); }
.itap-pill.expired{ border-color: rgba(148,163,184,.35); background: rgba(148,163,184,.08); }
.itap-pill.converted{ border-color: rgba(0,229,255,.35); background: rgba(0,229,255,.10); }
