/* UniverseAgent — estilos globales */
* { scrollbar-width: thin; scrollbar-color: #2a3040 transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #2a3040; border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

body { font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif; }

.nav-item { display:flex; align-items:center; gap:10px; padding:8px 12px; border-radius:10px; color:#8b93a7; cursor:pointer; transition:all .15s; font-weight:500; }
.nav-item:hover { background:#1e2330; color:#e2e8f0; }
.nav-item.active { background:linear-gradient(90deg, rgba(99,102,241,.18), rgba(139,92,246,.08)); color:#c7d2fe; border-left:2px solid #6366f1; }
.nav-item i { width:18px; text-align:center; font-size:13px; }
.nav-section { font-size:10px; text-transform:uppercase; letter-spacing:.12em; color:#4b5265; padding:14px 12px 4px; font-weight:600; }

.card { background:#161a23; border:1px solid #2a3040; border-radius:16px; }
.card-hover { transition:all .15s; cursor:pointer; }
.card-hover:hover { border-color:#6366f1; transform:translateY(-1px); }

.badge { display:inline-flex; align-items:center; gap:4px; font-size:10px; font-weight:600; padding:2px 8px; border-radius:99px; }
.b-green { background:rgba(16,185,129,.12); color:#34d399; }
.b-red { background:rgba(239,68,68,.12); color:#f87171; }
.b-amber { background:rgba(245,158,11,.12); color:#fbbf24; }
.b-blue { background:rgba(14,165,233,.12); color:#38bdf8; }
.b-purple { background:rgba(139,92,246,.12); color:#a78bfa; }
.b-gray { background:rgba(148,163,184,.12); color:#94a3b8; }

.btn { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:7px 14px; border-radius:10px; transition:all .15s; cursor:pointer; border:1px solid transparent; }
.btn-primary { background:#4f46e5; color:white; }
.btn-primary:hover { background:#6366f1; }
.btn-ghost { background:transparent; border-color:#2a3040; color:#b4bac9; }
.btn-ghost:hover { border-color:#6366f1; color:#e0e7ff; }
.btn-danger { background:rgba(239,68,68,.12); color:#f87171; }
.btn-danger:hover { background:rgba(239,68,68,.25); }

.input, select.input, textarea.input { background:#1e2330; border:1px solid #2a3040; border-radius:10px; padding:8px 12px; font-size:13px; color:#e2e8f0; width:100%; outline:none; transition:border .15s; }
.input:focus { border-color:#6366f1; }
.input::placeholder { color:#4b5265; }
label.lbl { display:block; font-size:11px; font-weight:600; color:#8b93a7; margin-bottom:4px; text-transform:uppercase; letter-spacing:.05em; }

.tbl { width:100%; font-size:13px; }
.tbl th { text-align:left; font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:#4b5265; padding:8px 12px; border-bottom:1px solid #2a3040; font-weight:600; }
.tbl td { padding:10px 12px; border-bottom:1px solid #1e2330; }
.tbl tbody tr { transition:background .1s; }
.tbl tbody tr:hover { background:#1a1f2b; }

.kanban-col { background:#12151d; border:1px solid #232837; border-radius:14px; min-width:270px; width:270px; display:flex; flex-direction:column; transition:border-color .15s, background .15s; }
.kanban-col.drop-target { border-color:#6366f1; background:#141827; box-shadow:inset 0 0 0 1px rgba(99,102,241,.35); }
.kanban-col.drop-target .kanban-drop { outline:2px dashed rgba(99,102,241,.4); outline-offset:-4px; border-radius:12px; }
.kanban-card { background:#1a1f2b; border:1px solid #2a3040; border-radius:12px; padding:12px; cursor:grab; transition:all .12s; }
.kanban-card:hover { border-color:#6366f1; }
.kanban-card:active { cursor:grabbing; }
.kanban-card.dragging { opacity:.45; border-color:#6366f1; transform:scale(.98); }

.toast { background:#1e2330; border:1px solid #2a3040; border-left:3px solid #6366f1; border-radius:12px; padding:12px 14px; font-size:12px; box-shadow:0 10px 30px rgba(0,0,0,.5); animation:slideIn .25s ease; }
.toast.success { border-left-color:#10b981; }
.toast.error { border-left-color:#ef4444; }
.toast.ai { border-left-color:#a78bfa; background:linear-gradient(135deg,#1e2330,#251f38); }
@keyframes slideIn { from { opacity:0; transform:translateX(20px);} to { opacity:1; transform:none;} }

.pulse-dot { width:7px; height:7px; border-radius:99px; background:#34d399; box-shadow:0 0 0 rgba(52,211,153,.6); animation:pulse 2s infinite; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)} 70%{box-shadow:0 0 0 7px rgba(52,211,153,0)} 100%{box-shadow:0 0 0 0 rgba(52,211,153,0)} }

.timeline-item { position:relative; padding-left:26px; padding-bottom:18px; }
.timeline-item::before { content:''; position:absolute; left:7px; top:20px; bottom:0; width:1px; background:#2a3040; }
.timeline-item:last-child::before { display:none; }
.timeline-dot { position:absolute; left:0; top:3px; width:15px; height:15px; border-radius:99px; display:flex; align-items:center; justify-content:center; font-size:7px; }

.skeleton { background:linear-gradient(90deg,#1a1f2b 25%,#232837 50%,#1a1f2b 75%); background-size:200% 100%; animation:shimmer 1.4s infinite; border-radius:10px; }
@keyframes shimmer { to { background-position:-200% 0; } }

.msg-in { background:#1e2330; border:1px solid #2a3040; border-radius:14px 14px 14px 4px; }
.msg-out { background:linear-gradient(135deg,#3730a3,#4f46e5); border-radius:14px 14px 4px 14px; }
.msg-ai { background:linear-gradient(135deg,#312e81,#5b21b6); border:1px solid #6d28d9; border-radius:14px 14px 4px 14px; }

/* ===== Copiloto IA ===== */
.copilot-panel { transform: translateX(100%); transition: transform .28s cubic-bezier(.4,0,.2,1); }
.copilot-panel.open { transform: translateX(0); }
.copilot-bubble-user { background:linear-gradient(135deg,#3730a3,#4f46e5); border-radius:14px 14px 4px 14px; padding:10px 13px; color:#fff; max-width:88%; margin-left:auto; white-space:pre-wrap; word-break:break-word; }
.copilot-bubble-ai { background:#1e2330; border:1px solid #2a3040; border-radius:14px 14px 14px 4px; padding:10px 13px; color:#d3d9e5; max-width:92%; white-space:pre-wrap; word-break:break-word; line-height:1.55; }
.copilot-bubble-ai b, .copilot-bubble-ai strong { color:#fff; }
.copilot-chip { font-size:10px; font-weight:600; padding:4px 10px; border-radius:99px; background:rgba(99,102,241,.1); border:1px solid rgba(99,102,241,.3); color:#a5b4fc; cursor:pointer; transition:all .15s; }
.copilot-chip:hover { background:rgba(99,102,241,.25); color:#e0e7ff; }
.copilot-typing { display:inline-flex; gap:4px; padding:12px 14px; }
.copilot-typing span { width:6px; height:6px; border-radius:99px; background:#6366f1; animation:copilotBounce 1.2s infinite; }
.copilot-typing span:nth-child(2){animation-delay:.15s} .copilot-typing span:nth-child(3){animation-delay:.3s}
@keyframes copilotBounce { 0%,60%,100%{transform:translateY(0);opacity:.4} 30%{transform:translateY(-5px);opacity:1} }

/* ===== Command Palette ===== */
.cmdk-item { display:flex; align-items:center; gap:11px; padding:9px 12px; border-radius:10px; cursor:pointer; font-size:13px; color:#b4bac9; transition:all .1s; }
.cmdk-item:hover, .cmdk-item.active { background:rgba(99,102,241,.14); color:#e0e7ff; }
.cmdk-item i { width:18px; text-align:center; font-size:12px; }
.cmdk-section { font-size:9px; text-transform:uppercase; letter-spacing:.12em; color:#4b5265; padding:10px 12px 3px; font-weight:700; }
.cmdk-kbd { margin-left:auto; font-size:9px; background:#232837; padding:2px 6px; border-radius:5px; color:#6b7280; }

/* ===== Sidebar móvil ===== */
@media (max-width: 767px) {
  .sidebar-mobile { transform: translateX(-100%); transition: transform .25s ease; }
  .sidebar-mobile.open { transform: translateX(0); box-shadow: 0 0 60px rgba(0,0,0,.6); }
}

/* ===== Notificaciones ===== */
.notif-item { display:flex; gap:11px; padding:10px 12px; border-radius:12px; cursor:pointer; transition:background .12s; border-left:3px solid transparent; }
.notif-item:hover { background:#1a1f2b; }
.notif-item.critical { border-left-color:#ef4444; }
.notif-item.warning { border-left-color:#f59e0b; }
.notif-item.info { border-left-color:#38bdf8; }
.notif-icon { width:32px; height:32px; border-radius:10px; display:flex; align-items:center; justify-content:center; font-size:12px; flex-shrink:0; }
.notif-item.critical .notif-icon { background:rgba(239,68,68,.12); color:#f87171; }
.notif-item.warning .notif-icon { background:rgba(245,158,11,.12); color:#fbbf24; }
.notif-item.info .notif-icon { background:rgba(14,165,233,.12); color:#38bdf8; }
@keyframes bellRing { 0%,100%{transform:rotate(0)} 15%{transform:rotate(14deg)} 30%{transform:rotate(-12deg)} 45%{transform:rotate(8deg)} 60%{transform:rotate(-6deg)} 75%{transform:rotate(3deg)} }
.bell-ring { animation: bellRing .8s ease; }
