/* ======================================================
   SEAN B SOLUTIONS
   GLOBAL UTILITY CLASSES

   File:
   /public_html/assets/css/utilities.css

   Production Version
====================================================== */


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


.d-none{

    display:none!important;

}



.d-block{

    display:block!important;

}



.d-flex{

    display:flex!important;

}



.d-grid{

    display:grid!important;

}



.flex-wrap{

    flex-wrap:wrap;

}



.flex-nowrap{

    flex-wrap:nowrap;

}





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


.align-center{

    align-items:center;

}



.align-start{

    align-items:flex-start;

}



.align-end{

    align-items:flex-end;

}



.justify-center{

    justify-content:center;

}



.justify-between{

    justify-content:space-between;

}



.justify-around{

    justify-content:space-around;

}



.justify-end{

    justify-content:flex-end;

}





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


.flex-row{

    flex-direction:row;

}



.flex-column{

    flex-direction:column;

}





/* ======================================================
   WIDTH & HEIGHT
====================================================== */


.w-100{

    width:100%;

}



.h-100{

    height:100%;

}



.max-width{

    max-width:var(--container-width);

    margin:auto;

}





/* ======================================================
   MARGIN UTILITIES
====================================================== */


.m-0{

    margin:0!important;

}



.mt-auto{

    margin-top:auto;

}



.mb-auto{

    margin-bottom:auto;

}



.mx-auto{

    margin-left:auto;

    margin-right:auto;

}





/* ======================================================
   PADDING UTILITIES
====================================================== */


.p-0{

    padding:0!important;

}



.p-1{

    padding:var(--space-1);

}



.p-2{

    padding:var(--space-2);

}



.p-3{

    padding:var(--space-3);

}



.p-4{

    padding:var(--space-4);

}



.p-5{

    padding:var(--space-5);

}





/* ======================================================
   TEXT UTILITIES
====================================================== */


.text-center{

    text-align:center!important;

}



.text-left{

    text-align:left!important;

}



.text-right{

    text-align:right!important;

}



.text-white{

    color:var(--white)!important;

}



.text-primary{

    color:var(--primary)!important;

}



.text-secondary{

    color:var(--secondary)!important;

}





/* ======================================================
   BACKGROUND UTILITIES
====================================================== */


.bg-primary{

    background:var(--primary)!important;

}



.bg-secondary{

    background:var(--secondary)!important;

}



.bg-light{

    background:var(--background)!important;

}



.bg-white{

    background:var(--white)!important;

}





/* ======================================================
   BORDER UTILITIES
====================================================== */


.border{

    border:1px solid var(--border);

}



.rounded-sm{

    border-radius:var(--radius-sm);

}



.rounded{

    border-radius:var(--radius-md);

}



.rounded-lg{

    border-radius:var(--radius-lg);

}



.rounded-pill{

    border-radius:var(--radius-pill);

}





/* ======================================================
   SHADOW UTILITIES
====================================================== */


.shadow-sm{

    box-shadow:var(--shadow-sm);

}



.shadow{

    box-shadow:var(--shadow-md);

}



.shadow-lg{

    box-shadow:var(--shadow-lg);

}





/* ======================================================
   POSITION UTILITIES
====================================================== */


.position-relative{

    position:relative;

}



.position-absolute{

    position:absolute;

}



.position-fixed{

    position:fixed;

}





/* ======================================================
   OVERFLOW
====================================================== */


.overflow-hidden{

    overflow:hidden;

}



.overflow-auto{

    overflow:auto;

}



.no-scroll{

    overflow:hidden;

}





/* ======================================================
   IMAGE UTILITIES
====================================================== */


.object-cover{

    object-fit:cover;

}



.object-contain{

    object-fit:contain;

}





/* ======================================================
   TRANSITIONS
====================================================== */


.transition{

    transition:var(--transition);

}





/* ======================================================
   HOVER EFFECTS
====================================================== */


.hover-up{

    transition:var(--transition);

}



.hover-up:hover{

    transform:translateY(-5px);

}





/* ======================================================
   VISIBILITY
====================================================== */


.visible{

    visibility:visible;

}



.invisible{

    visibility:hidden;

}





/* ======================================================
   MOBILE HELPERS
====================================================== */


.mobile-only{

    display:none;

}



.desktop-only{

    display:block;

}




@media(max-width:900px){


.mobile-only{

    display:block;

}



.desktop-only{

    display:none;

}



.flex-column-mobile{

    flex-direction:column;

}



.text-center-mobile{

    text-align:center;

}



}





/* ======================================================
   SMALL PHONE
====================================================== */


@media(max-width:480px){


.hide-mobile{

    display:none!important;

}



}