/*//////////*/
/*  UTILS  */
/*////////*/
.text-small {
    font-size: var(--font-size-small);
    line-height: calc(var(--font-size-small) * 1.5);
}

.text-large {
    font-size: var(--font-size-large);
    line-height: calc(var(--font-size-large) * 1.5);
}

.text-xlarge {
    font-size: var(--font-size-xlarge);
    line-height: calc(var(--font-size-xlarge) * 1.5);
}

.text-subheading { font-size: var(--font-size-base); }

.text-color-brand { color: var(--brand-color-primary) !important; }
.text-color-primary { color: var(--text-primary) !important; }
.text-color-secondary { color: var(--text-secondary) !important; }
.text-color-tertiary { color: var(--text-tertiary) !important; }
.text-color-white { color: var(--background-white) !important; }
.text-color-black { color: var(--background-black) !important; }

.text-color-menu-digital { color: var(--brand-color-menu-digital) !important; }
.text-color-online { color: var(--brand-color-online) !important; }
.text-color-salon { color: var(--brand-color-salon) !important; }
.text-color-reservas { color: var(--brand-color-reservas) !important; }
.text-color-facturacion { color: var(--brand-color-facturacion) !important; }

.font-weight-regular { font-weight: var(--font-weight-regular) !important;}
.font-weight-semi-bold { font-weight: var(--font-weight-semi-bold) !important;}
.font-weight-bold { font-weight: var(--font-weight-bold) !important;}

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

.margin-remove { margin: 0 !important; }

.margin-remove-vertical {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.margin-remove-horizontal {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.margin-remove-bottom { margin-bottom: 0 !important; }

.margin-remove-top { margin-top: 0 !important; }

.padding-remove { padding: 0 !important; }

.padding-remove-vertical {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.padding-remove-horizontal {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.margin-top-xxsmall { margin-top: var(--spacing-4) !important; }
.margin-right-xxsmall { margin-right: var(--spacing-4) !important; }
.margin-bottom-xxsmall { margin-bottom: var(--spacing-4) !important; }
.margin-left-xxsmall { margin-left: var(--spacing-4) !important; }

.margin-top-xsmall { margin-top: var(--spacing-8) !important; }
.margin-right-xsmall { margin-right: var(--spacing-8) !important; }
.margin-bottom-xsmall { margin-bottom: var(--spacing-8) !important; }
.margin-left-xsmall { margin-left: var(--spacing-8) !important; }

.margin-top-small { margin-top: var(--spacing-16) !important; }
.margin-right-small { margin-right: var(--spacing-16) !important; }
.margin-bottom-small { margin-bottom: var(--spacing-16) !important; }
.margin-left-small { margin-left: var(--spacing-16) !important; }

.margin-top-medium { margin-top: var(--spacing-24) !important; }
.margin-right-medium { margin-right: var(--spacing-24) !important; }
.margin-bottom-medium { margin-bottom: var(--spacing-24) !important; }
.margin-left-medium { margin-left: var(--spacing-24) !important; }

.margin-top-large { margin-top: var(--spacing-32) !important; }
.margin-right-large { margin-right: var(--spacing-32) !important; }
.margin-bottom-large { margin-bottom: var(--spacing-32) !important; }
.margin-left-large { margin-left: var(--spacing-32) !important; }

.margin-top-xlarge { margin-top: var(--spacing-40) !important; }
.margin-right-xlarge { margin-right: var(--spacing-40) !important; }
.margin-bottom-xlarge { margin-bottom: var(--spacing-40) !important; }
.margin-left-xlarge { margin-left: var(--spacing-40) !important; }

.margin-top-xxlarge { margin-top: var(--spacing-48) !important; }
.margin-right-xxlarge { margin-right: var(--spacing-48) !important; }
.margin-bottom-xxlarge { margin-bottom: var(--spacing-48) !important; }
.margin-left-xxlarge { margin-left: var(--spacing-48) !important; }

.margin-top-huge { margin-top: var(--spacing-60) !important; }
.margin-right-huge { margin-right: var(--spacing-60) !important; }
.margin-bottom-huge { margin-bottom: var(--spacing-60) !important; }
.margin-left-huge { margin-left: var(--spacing-60) !important; }


/* Visible elements to screen sizes */
@media (min-width: 640px) {
    .visible-s { display: none !important; }
}

@media (min-width: 960px) {
    .visible-m { display: none !important; }
}

@media (min-width: 1200px) {
    .visible-l { display: none !important; }
}

@media (min-width: 1400px) {
    .visible-xl { display: none !important; }
}

@media (max-width: 639px) {
    .hidden-s { display: none !important; }
}

@media (max-width: 959px) {
    .hidden-m { display: none !important; }
}

@media (max-width: 1199px) {
    .hidden-l { display: none !important; }
}

@media (max-width: 1399px) {
    .hidden-xl { display: none !important; }
}
