/*--------------------------------------------------------------------
  --------------------------------------------------------------------
  -  CREACION        : Daniel Marquez  -----> papa de Victor Vasquez -
  -  FECHA           : 27/12/2024                                    -
  -  APLICACION      : Sitio Agentes Confío                          -
  -  DESCRIPCION     : Paleta de Colores | Re-branding               -
  -  OBSERVACION     : Tipología de colores y nomenclaturas          -
                       obtenidas del sitio diseño realizado por CM   -
  -  LINK            https://www.color-hex.com/color/055ba6#comments -
----------------------------------------------------------------------
--------------------------------------------------------------------*/

/* Crear objeto de difuminado  */

:root {
    /* Colores Base */
    --celeste-fuerte: #055BA6; /* Titulos - Daniel Marquez 27-12-24  #023E73* - original #0078FF --- variacion por 800 #055BA6*/
    --celeste-claro: #92c1e9; /* Subtitulos - Daniel Marquez 27-12-24  #66ADFF,  cambio 2 --- #92c1e9 a peticion de Erick*/
    --gris-claro: #D3D3D3; /* Titulos de columna para  de grilla - Daniel Marquez 27-12-24 */
    --gris-oscuro: #717070; /* Color para Columna de titulos - Daniel Marquez 27-12-24 */
    --golden: #BD9B60;

    --blanco: #FFFFFF;
    --negro: #000000;
    --azul: #0000FF;
    --rojo: #FF0000;
}

/* Clases para Titulos */
.bg-celeste-fuerte {
    background-color: var(--celeste-fuerte);
}
/* Clases para Subtitulos */
.bg-celeste-claro {
    background-color: var(--celeste-claro);
}
/* Clases para Fondos */
.bg-gris-claro {
    background-color: var(--gris-claro);
}
.bg-gris-oscuro {
    background-color: var(--gris-oscuro);
}
.bg-blanco {
    background-color: var(--blanco);
}
.bg-negro {
    background-color: var(--negro);
}
.bg-azul {
    background-color: var(--azul);
}
.bg-rojo {
    background-color: var(--rojo);
}

/* Clase para barra lateral de navegación*/

.bg-gris-oscuro_nav {
    background-color: var(--gris-oscuro);
}

/* Clases para Texto */   /*Las clases para texto se manejaran directamente en la clases CSS dedicada para textos realizada por Victor Vasquez - 27-12-2024*/

    
.text-celeste-fuerte {
    color: var(--celeste-fuerte);
}

.text-celeste-claro {
    color: var(--celeste-claro);
}

.text-gris-claro {
    color: var(--gris-claro);
}

.text-gris-oscuro {
    color: var(--gris-oscuro);
}

.text-blanco {
    color: var(--blanco) !important;
}

.text-negro {
    color: var(--negro);
}

.text-azul {
    color: var(--azul);
}

.text-rojo {
    color: var(--rojo);
}

.text-golden {
    color: var(--golden);
}


/* Clases para Bordes */
.border-celeste-fuerte {
    border: 1px solid var(--celeste-fuerte);
}

.border-celeste-claro {
    border: 1px solid var(--celeste-claro);
}

.border-gris-claro {
    border: 1px solid var(--gris-claro);
}

.border-gris-oscuro {
    border: 1px solid var(--gris-oscuro);
}

.border-blanco {
    border: 1px solid var(--blanco);
}

.border-negro {
    border: 1px solid var(--negro);
}

.border-azul {
    border: 1px solid var(--azul);
}

.border-rojo {
    border: 1px solid var(--rojo);
}







/* Clases para Hover (Ejemplo de interactividad) */
/*
.bg-celeste-fuerte:hover {
    background-color: var(--celeste-claro);
}
.bg-celeste-claro:hover {
    background-color: var(--celeste-fuerte);
}
.bg-gris-claro:hover {
    background-color: var(--gris-oscuro);
}
.bg-gris-oscuro:hover {
    background-color: var(--gris-claro);
}
.bg-blanco:hover {
    background-color: var(--gris-claro);
}
.bg-negro:hover {
    background-color: var(--gris-oscuro);
}
.bg-azul:hover {
    background-color: var(--celeste-fuerte);
}
.bg-rojo:hover {
    background-color: var(--celeste-fuerte);
}

.text-celeste-fuerte:hover {
    color: var(--celeste-claro);
}
.text-celeste-claro:hover {
    color: var(--celeste-fuerte);
}
.text-gris-claro:hover {
    color: var(--gris-oscuro);
}
.text-gris-oscuro:hover {
    color: var(--gris-claro);
}
.text-blanco:hover {
    color: var(--gris-claro);
}
.text-negro:hover {
    color: var(--gris-oscuro);
}
.text-azul:hover {
    color: var(--celeste-fuerte);
}
.text-rojo:hover {
    color: var(--celeste-fuerte);
}

.border-celeste-fuerte:hover {
    border-color: var(--celeste-claro);
}
.border-celeste-claro:hover {
    border-color: var(--celeste-fuerte);
}
.border-gris-claro:hover {
    border-color: var(--gris-oscuro);
}
.border-gris-oscuro:hover {
    border-color: var(--gris-claro);
}
.border-blanco:hover {
    border-color: var(--gris-claro);
}
.border-negro:hover {
    border-color: var(--gris-oscuro);
}
.border-azul:hover {
    border-color: var(--celeste-fuerte);
}
.border-rojo:hover {
    border-color: var(--celeste-fuerte);
}
Hasta aca los cambio en los colores creados anteriormente, dichos colores y hovers para colores primarios ya no se van a utilizar 27/12/2024 Daniel Marquez
*/