/* =========================================================
   AURELIA JEWELLERY
   ASAREH TYPOGRAPHY SYSTEM

   File:
   assets/css/asareh-fonts.css
========================================================= */


/* =========================================================
   01. IRANSANS WEB
   Main Persian Typeface
========================================================= */

@font-face {
    font-family: "AsarehIRANSans";
    src: url("../fonts/iransans/IRANSansWeb-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "AsarehIRANSans";
    src: url("../fonts/iransans/IRANSansWeb-Medium.ttf") format("truetype");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "AsarehIRANSans";
    src: url("../fonts/iransans/IRANSansWeb-Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}


/* =========================================================
   02. KOHINOOR ARABIC
   Luxury Persian Display Typeface
========================================================= */

@font-face {
    font-family: "AsarehKohinoor";
    src: url("../fonts/kohinoor/KohinoorArabic-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "AsarehKohinoor";
    src: url("../fonts/kohinoor/KohinoorArabic-Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}


/* =========================================================
   03. VAZIR
   Numeric / Compact UI Typeface
========================================================= */

@font-face {
    font-family: "AsarehVazir";
    src: url("../fonts/vazir/Vazir-Regular.woff2") format("woff2");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "AsarehVazir";
    src: url("../fonts/vazir/Vazir-Medium.woff2") format("woff2");
    font-style: normal;
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "AsarehVazir";
    src: url("../fonts/vazir/Vazir-Bold.woff2") format("woff2");
    font-style: normal;
    font-weight: 700;
    font-display: swap;
}


/* =========================================================
   04. TYPOGRAPHY VARIABLES
========================================================= */

:root {

    --asareh-font-primary:
        "AsarehIRANSans",
        Tahoma,
        Arial,
        sans-serif;

    --asareh-font-body:
        "AsarehIRANSans",
        Tahoma,
        Arial,
        sans-serif;

    --asareh-font-ui:
        "AsarehVazir",
        "AsarehIRANSans",
        Tahoma,
        Arial,
        sans-serif;

    --asareh-font-display:
        "AsarehKohinoor",
        "AsarehIRANSans",
        Tahoma,
        sans-serif;

    --asareh-font-serif:
        "AsarehKohinoor",
        "AsarehIRANSans",
        Tahoma,
        sans-serif;

    --asareh-font-latin:
        "Bodoni 72",
        Didot,
        Georgia,
        "Times New Roman",
        serif;

}


/* =========================================================
   05. GLOBAL TYPOGRAPHY
========================================================= */

html {
    font-family: var(--asareh-font-body);
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    font-family: var(--asareh-font-body) !important;
    font-weight: 400;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/* =========================================================
   06. NORMAL TEXT
========================================================= */

p,
li,
blockquote,
figcaption,
address,
dd,
dt {
    font-family: var(--asareh-font-body);
}


/* =========================================================
   07. FORM AND UI
========================================================= */

button,
input,
textarea,
select,
option,
label,
legend {
    font-family: var(--asareh-font-ui) !important;
}


/* =========================================================
   08. NAVIGATION
========================================================= */

.asareh-header__nav-link,
.asareh-mobile-menu__link,
.asareh-mobile-menu__footer,
.asareh-button,
.asareh-text-link,
.asareh-breadcrumb,
.asareh-shop-toolbar,
.asareh-shop-filter,
.asareh-footer {
    font-family: var(--asareh-font-ui) !important;
}


/* =========================================================
   09. MAIN LUXURY TITLES
========================================================= */

.asareh-hero__title,
.asareh-shop-hero__title,
.asareh-section-title,
.asareh-editorial__title,
.asareh-signature__title,
.asareh-newsletter__title,
.asareh-shop__title {
    font-family: var(--asareh-font-display) !important;
    font-weight: 400 !important;
}


/* =========================================================
   10. TITLE EMPHASIS
========================================================= */

.asareh-hero__title span,
.asareh-shop-hero__title span,
.asareh-section-title span,
.asareh-editorial__title span,
.asareh-signature__title span {
    font-family: var(--asareh-font-display) !important;
    font-weight: 400 !important;
    font-style: normal !important;
}


/* =========================================================
   11. PRODUCT TITLES
========================================================= */

.asareh-product-card__title,
.asareh-category-card__title,
.asareh-journal-card h3,
.asareh-service-card h3,
.asareh-shop-trust__item h3 {
    font-family: var(--asareh-font-display) !important;
    font-weight: 400;
}


/* =========================================================
   12. PRODUCT META
========================================================= */

.asareh-product-card__meta,
.asareh-product-card__price,
.asareh-filter-check,
.asareh-filter-price,
.asareh-shop-category,
.asareh-shop__count {
    font-family: var(--asareh-font-ui) !important;
}


/* =========================================================
   13. NUMERIC UI
========================================================= */

.asareh-product-card__price,
.asareh-cart-button__count,
.asareh-pagination,
.asareh-filter-check__count,
.asareh-filter-price input,
.asareh-shop__count {
    font-family: var(--asareh-font-ui) !important;
    font-variant-numeric: tabular-nums;
}


/* =========================================================
   14. BRAND LOGO
========================================================= */

.asareh-header__logo-main,
.asareh-footer__logo,
.asareh-loader__brand {
    font-family: var(--asareh-font-latin) !important;
    font-weight: 400;
}


/* =========================================================
   15. ENGLISH EDITORIAL TEXT
========================================================= */

.asareh-featured__title {
    font-family: var(--asareh-font-latin) !important;
    font-weight: 400;
}


/* =========================================================
   16. EYEBROW
========================================================= */

.asareh-eyebrow,
.asareh-header__logo-sub,
.asareh-loader__text {
    font-family: var(--asareh-font-ui) !important;
    font-weight: 500;
}


/* =========================================================
   17. FOOTER
========================================================= */

.asareh-footer__column h3 {
    font-family: var(--asareh-font-display) !important;
}

.asareh-footer__column a,
.asareh-footer__brand p,
.asareh-footer__bottom {
    font-family: var(--asareh-font-body) !important;
}


/* =========================================================
   18. SEARCH
========================================================= */

.asareh-search-drawer,
.asareh-search-form,
.asareh-search-form__input,
.asareh-search-form__submit {
    font-family: var(--asareh-font-ui) !important;
}


/* =========================================================
   19. NEWSLETTER
========================================================= */

.asareh-newsletter__description,
.asareh-newsletter__form,
.asareh-newsletter__form input,
.asareh-newsletter__form button {
    font-family: var(--asareh-font-ui) !important;
}


/* =========================================================
   20. SHOP FILTER
========================================================= */

.asareh-filter-group__title {
    font-family: var(--asareh-font-display) !important;
}

.asareh-filter-check__label,
.asareh-filter-check__count,
.asareh-filter-price,
.asareh-shop-filter__reset {
    font-family: var(--asareh-font-ui) !important;
}


/* =========================================================
   21. LATIN TEXT UTILITY
========================================================= */

[lang="en"],
.asareh-font-latin {
    font-family: var(--asareh-font-latin) !important;
    direction: ltr;
}


/* =========================================================
   22. DEFAULT HEADING SAFETY
========================================================= */

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--asareh-font-display);
}


/* =========================================================
   23. DEFAULT LINK SAFETY
========================================================= */

a {
    font-family: inherit;
}


/* =========================================================
   24. MOBILE TYPOGRAPHY
========================================================= */

@media (max-width: 768px) {

    body {
        font-family: var(--asareh-font-body) !important;
        font-size: 15px;
        line-height: 1.85;
    }

    .asareh-hero__title,
    .asareh-shop-hero__title,
    .asareh-section-title,
    .asareh-editorial__title,
    .asareh-signature__title {
        line-height: 1.22;
        letter-spacing: 0 !important;
    }

    button,
    input,
    textarea,
    select {
        font-size: 16px;
    }

}


/* =========================================================
   25. IOS
========================================================= */

@supports (-webkit-touch-callout: none) {

    input,
    textarea,
    select {
        font-size: 16px;
    }

}


/* =========================================================
   26. HIGH CONTRAST
========================================================= */

@media (prefers-contrast: more) {

    body {
        font-weight: 500;
    }

}