fix: version 2.8.5 -- boton para volver a ocultar el catalogo de marcas

Al "+" para desplegar los logos de marca le faltaba su contraparte: un boton "-" junto al
titulo del bloque para volver a colapsarlo.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

frontend/package.json

@@ -1,7 +1,7 @@
 {
   "name": "project-linkedcorp-frontend",
   "private": true,
-  "version": "2.8.4",
+  "version": "2.8.5",
   "type": "module",
   "scripts": {
     "dev": "vite",

frontend/src/i18n/messages.js

@@ -212,6 +212,7 @@ export const messages = {
     vault_field_icon: 'Ícono',
     vault_icon_auto: 'Automático (inicial del nombre)',
     vault_icon_more: 'Más íconos (marcas conocidas)',
+    vault_icon_less: 'Ocultar íconos de marca',
     vault_password_unchanged_hint: 'Dejar en blanco para no cambiarla',
     vault_reveal: 'Revelar',
     vault_copy: 'Copiar',
@@ -544,6 +545,7 @@ export const messages = {
     vault_field_icon: 'Icon',
     vault_icon_auto: 'Automatic (name initial)',
     vault_icon_more: 'More icons (well-known brands)',
+    vault_icon_less: 'Hide brand icons',
     vault_password_unchanged_hint: 'Leave blank to keep it unchanged',
     vault_reveal: 'Reveal',
     vault_copy: 'Copy',

frontend/src/pages/Contrasenas/ContrasenasPage.jsx

@@ -1,7 +1,7 @@
 import { useEffect, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import {
-  Plus, Trash2, Eye, EyeOff, Copy, Pencil, Save, X, RefreshCw, ShieldAlert, MoreVertical,
+  Plus, Minus, Trash2, Eye, EyeOff, Copy, Pencil, Save, X, RefreshCw, ShieldAlert, MoreVertical,
   Mail, Globe, Server, Database, Cloud, Shield, Lock, Wifi, CreditCard, Building2, Printer,
   Smartphone, KeyRound, HardDrive, Router, UserCog,
 } from 'lucide-react';
@@ -361,18 +361,31 @@ export default function ContrasenasPage() {
               ))}
             </div>
             {showBrandIcons ? (
-              <div className="vault-icon-picker vault-icon-picker-brands">
-                {Object.entries(BRAND_ICONS).map(([key, icon]) => (
+              <div>
+                <div className="vault-icon-brands-header">
+                  <span className="text-muted" style={{ fontSize: '.72rem' }}>{t('vault_icon_more')}</span>
                   <button
                     type="button"
-                    key={key}
-                    className={`vault-icon-option brand ${form.iconKey === key ? 'selected' : ''}`}
-                    title={icon.title}
-                    onClick={() => setForm((f) => ({ ...f, iconKey: key }))}
+                    className="icon-btn"
+                    title={t('vault_icon_less')}
+                    onClick={() => setShowBrandIcons(false)}
                   >
-                    <BrandSvg icon={icon} size={16} />
+                    <Minus size={14} />
                   </button>
-                ))}
+                </div>
+                <div className="vault-icon-picker vault-icon-picker-brands">
+                  {Object.entries(BRAND_ICONS).map(([key, icon]) => (
+                    <button
+                      type="button"
+                      key={key}
+                      className={`vault-icon-option brand ${form.iconKey === key ? 'selected' : ''}`}
+                      title={icon.title}
+                      onClick={() => setForm((f) => ({ ...f, iconKey: key }))}
+                    >
+                      <BrandSvg icon={icon} size={16} />
+                    </button>
+                  ))}
+                </div>
               </div>
             ) : (
               <button

frontend/src/styles/app.css

@@ -386,7 +386,8 @@ table.list-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
 .pin-input { -webkit-text-security: disc; letter-spacing: 4px; }
 
 .vault-icon-picker { display: flex; flex-wrap: wrap; gap: 8px; }
-.vault-icon-picker-brands { max-height: 150px; overflow-y: auto; padding-top: 8px; margin-top: 4px; border-top: 1px dashed rgb(var(--line)); }
+.vault-icon-brands-header { display: flex; align-items: center; justify-content: space-between; padding-top: 8px; margin-top: 4px; border-top: 1px dashed rgb(var(--line)); }
+.vault-icon-picker-brands { max-height: 150px; overflow-y: auto; margin-top: 6px; }
 .vault-icon-option {
   width: 36px; height: 36px; border-radius: 999px; border: 1px solid rgb(var(--line));
   background: rgb(var(--field)); color: rgb(var(--body)); cursor: pointer;