/*=========================================================
  Proyecto : Fundación de Veteranos de Guerra (FUVEPAZ)
  Archivo  : utilities.css
  Versión  : 1.0.0
  Descripción:
  Clases utilitarias reutilizables.
=========================================================*/


/*======================================
  CONTENEDOR
======================================*/

.container{
    width:90%;
    max-width:var(--container-width);
    margin:0 auto;
}


/*======================================
  TEXTO
======================================*/

.text-center{
    text-align:center;
}

.text-left{
    text-align:left;
}

.text-right{
    text-align:right;
}


/*======================================
  DISPLAY
======================================*/

.flex{
    display:flex;
}

.grid{
    display:grid;
}

.block{
    display:block;
}

.none{
    display:none;
}


/*======================================
  FLEX
======================================*/

.justify-between{
    justify-content:space-between;
}

.justify-center{
    justify-content:center;
}

.align-center{
    align-items:center;
}

.flex-column{
    flex-direction:column;
}

.flex-wrap{
    flex-wrap:wrap;
}

.gap-sm{
    gap:var(--space-sm);
}

.gap-md{
    gap:var(--space-md);
}

.gap-lg{
    gap:var(--space-lg);
}


/*======================================
  ESPACIADOS
======================================*/

.mt-sm{
    margin-top:var(--space-sm);
}

.mt-md{
    margin-top:var(--space-md);
}

.mt-lg{
    margin-top:var(--space-lg);
}

.mt-xl{
    margin-top:var(--space-xl);
}

.mb-sm{
    margin-bottom:var(--space-sm);
}

.mb-md{
    margin-bottom:var(--space-md);
}

.mb-lg{
    margin-bottom:var(--space-lg);
}

.mb-xl{
    margin-bottom:var(--space-xl);
}

.pt-lg{
    padding-top:var(--space-lg);
}

.pb-lg{
    padding-bottom:var(--space-lg);
}

.py-xl{
    padding-top:var(--space-xl);
    padding-bottom:var(--space-xl);
}


/*======================================
  SOMBRAS
======================================*/

.shadow-sm{
    box-shadow:var(--shadow-sm);
}

.shadow-md{
    box-shadow:var(--shadow-md);
}

.shadow-lg{
    box-shadow:var(--shadow-lg);
}


/*======================================
  BORDES
======================================*/

.rounded-sm{
    border-radius:var(--radius-sm);
}

.rounded-md{
    border-radius:var(--radius-md);
}

.rounded-lg{
    border-radius:var(--radius-lg);
}


/*======================================
  FONDOS
======================================*/

.bg-white{
    background:var(--color-white);
}

.bg-light{
    background:var(--color-light);
}

.bg-primary{
    background:var(--color-primary);
}

.bg-dark{
    background:var(--color-primary-dark);
}


/*======================================
  COLORES DE TEXTO
======================================*/

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

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

.text-gray{
    color:var(--color-text-light);
}


/*======================================
  CURSOR
======================================*/

.pointer{
    cursor:pointer;
}


/*======================================
  IMÁGENES
======================================*/

.img-responsive{
    width:100%;
    height:auto;
    display:block;
}


/*======================================
  TRANSICIONES
======================================*/

.transition{
    transition:var(--transition-normal);
}