/* =============================================================
   ADN BROKER (adnbroker.com) — Brand colors
   Colores tomados de su web publica adnbroker-latam.com el 24/09/2026.

   Identidad de la web:
     · Violeta de marca  #754FFE  (CTA "Iniciar Sesion", en degradado hacia #508FEE)
     · Violeta claro     #8B5CF6  (el tono mas repetido en la pagina)
     · Morado intenso    #9500E0  (boton flotante de chat)
     · Fondo profundo    #06061B  (toda la web es oscura)
     · Fondo de seccion  #1A1A2E
     · Lavanda de texto  rgba(200,180,255,.65) sobre los fondos oscuros
     · Botones pill (999px)

   POR QUE EL VIOLETA CAMBIA ENTRE TEMAS
   Su web es oscura y el violeta #8B5CF6 luce bien sobre negro, pero como
   color de boton en tema CLARO el texto blanco encima solo da 4,23 — por
   debajo del 4,5 que pide AA. Por eso:
     · claro  → #754FFE (el de su CTA): blanco encima da 4,87 ✓
     · oscuro → #9B7BFF con texto #0B0B1F encima: 5,79 ✓
   El degradado de su web NO se lleva al CRM: en tablas y menus el color
   plano se lee mejor y Vuexy lo usa en decenas de componentes.

   Tema principal: CLARO (APP_DEFAULT_THEME_STYLE=light).
   ============================================================= */

/* ---- LIGHT (tema principal) ---- */
:root {
    --color-primary:        #754FFE;
    --color-primary-rgb:    117, 79, 254;
    --color-primary-dark:   #5F3AE0;
    --color-primary-light:  rgba(117, 79, 254, 0.14);
    /* Blanco sobre el violeta de marca: 4,87 */
    --color-on-primary:     #FFFFFF;

    --color-secondary:      #06061B;
    --color-secondary-rgb:  6, 6, 27;
    --color-secondary-dark: #03030F;

    /* Override Bootstrap/Vuexy primary → violeta de marca */
    --bs-primary:           #754FFE;
    --bs-primary-rgb:       117, 79, 254;
    --bs-link-color:        #754FFE;
    --bs-link-hover-color:  #5F3AE0;

    --color-menu-bg:        #FFFFFF;
    --color-menu-text:      #3A3A52;
    --color-menu-section:   #8D8DA8;

    /* Gris con un matiz violeta, para que el fondo no pelee con la marca */
    --color-body-bg:        #F5F5FB;
    --color-body-bg-rgb:    245, 245, 251;
    --color-body-text:      #2B2B3A;
    --color-card-bg:        #FFFFFF;
}

/* ---- DARK (secundario, via toggle) ----
   Este es el que mas se parece a su web: fondo #06061B real de la pagina,
   tarjetas sobre el tono de seccion y el violeta sin apagar. */
html[data-app-style="dark"] {
    --color-primary:        #9B7BFF;
    --color-primary-rgb:    155, 123, 255;
    --color-primary-dark:   #8B5CF6;
    --color-primary-light:  rgba(155, 123, 255, 0.14);
    /* Texto SOBRE el violeta (botones, menu activo). El blanco daria 3,44;
       el fondo profundo de la marca da 5,79. */
    --color-on-primary:     #0B0B1F;

    --color-secondary:      #C8B4FF;
    --color-secondary-rgb:  200, 180, 255;
    --color-secondary-dark: #A98FFF;

    --bs-primary:           #9B7BFF;
    --bs-primary-rgb:       155, 123, 255;
    --bs-link-color:        #9B7BFF;
    --bs-link-hover-color:  #C8B4FF;

    --color-menu-bg:        #12122A;
    --color-menu-text:      #C9C9E3;
    --color-menu-section:   #7A7AA0;

    --color-body-bg:        #06061B;
    --color-body-bg-rgb:    6, 6, 27;
    --color-body-text:      #C9C9E3;
    --color-card-bg:        #12122A;
}

/* ---- Empty state (paginas del panel) ---- */
.empty-state { padding: 3rem 1rem; }
.empty-state.large { padding: 4rem 1rem; }
.empty-state .avatar { margin: 0 auto 1.5rem; }