/* Components / styles / components.css — primitivos de UI sem estado de negócio */

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);
  border-radius:var(--radius-sm);font-weight:500;font-size:13px;cursor:pointer;border:1px solid transparent;
  padding:0 var(--space-5);height:34px;transition:background var(--dur-fast) var(--ease-standard),border-color var(--dur-fast),color var(--dur-fast);
  white-space:nowrap;font-family:var(--font-ui);
}
.btn svg{width:14px;height:14px;}
.btn-primary{background:var(--accent);color:var(--text-on-accent);}
.btn-primary:hover{background:var(--accent-hover);}
.btn-secondary{background:var(--surface);border-color:var(--border-strong);color:var(--text-primary);}
.btn-secondary:hover{background:var(--surface-sunken);}
.btn-ghost{background:transparent;color:var(--text-secondary);}
.btn-ghost:hover{background:var(--surface-sunken);color:var(--text-primary);}
.btn-icon{width:34px;padding:0;flex:none;}
.btn-icon.btn-sm{width:30px;height:30px;}

.icon-btn{
  width:32px;height:32px;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;
  color:var(--text-secondary);cursor:pointer;transition:background var(--dur-fast) var(--ease-standard),color var(--dur-fast);flex:none;
}
.icon-btn:hover{background:var(--surface-sunken);color:var(--text-primary);}
.icon-btn svg{width:17px;height:17px;}

.avatar{
  width:26px;height:26px;border-radius:50%;background:var(--accent-subtle);color:var(--accent);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;flex:none;font-family:var(--font-mono);
}

.badge{
  display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:var(--radius-full);
  font-size:11px;font-weight:500;border:1px solid transparent;line-height:1.7;
}
.badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor;}
.badge-neutral{background:var(--surface-sunken);color:var(--text-secondary);border-color:var(--border);}
.badge-success{background:var(--success-bg);color:var(--success);border-color:var(--success-border);}
.badge-iris{background:var(--iris-bg);color:var(--iris);border-color:var(--iris-border);}

/* dropdown */
.dropdown{position:relative;}
.dropdown-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:212px;background:var(--surface-raised);
  border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:var(--space-2);
  opacity:0;transform:translateY(-4px) scale(.98);pointer-events:none;z-index:60;
  transition:opacity var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out);
}
.dropdown.is-open .dropdown-menu{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}
.dropdown-menu.align-left{right:auto;left:0;}
.dropdown-label{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;color:var(--text-tertiary);
  padding:var(--space-2) var(--space-3);
}
.dropdown-item{
  display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:var(--radius-xs);
  font-size:13px;color:var(--text-secondary);cursor:pointer;transition:background var(--dur-fast);width:100%;text-align:left;
}
.dropdown-item:hover{background:var(--surface-sunken);color:var(--text-primary);}
.dropdown-item svg{width:15px;height:15px;flex:none;color:var(--text-tertiary);}
.dropdown-item.selected{color:var(--accent);}
.dropdown-item.selected svg{color:var(--accent);}
.dropdown-item.disabled{color:var(--text-disabled);cursor:not-allowed;}
.dropdown-item.disabled:hover{background:none;}
.dropdown-divider{height:1px;background:var(--border);margin:var(--space-2) 0;}

/* tooltip leve — usado nos ícones da sidebar recolhida */
.tip-wrap{position:relative;}
.tip-lite{
  position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%) translateX(-4px);
  background:var(--tooltip-bg);color:var(--tooltip-text);font-size:12px;padding:5px 9px;border-radius:var(--radius-sm);
  white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out);
  box-shadow:var(--shadow-md);z-index:70;
}
.tip-wrap:hover .tip-lite,.tip-wrap:focus-within .tip-lite{opacity:1;transform:translateY(-50%) translateX(0);}