/*==================================================
  TutorMatch Design System v2.0
  File        : typography.css
  Description : Global Typography
==================================================*/


/*==================================================
  1. GOOGLE FONTS
==================================================*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@600;700;800&display=swap');
/*==================================================
  2. BODY TYPOGRAPHY
==================================================*/

body{

    font-family:var(--font-body);

    font-size:var(--font-size-body);

    font-weight:var(--font-weight-regular);

    line-height:var(--line-height-body);

    color:var(--text-body);

    background:var(--color-background);

}
/*==================================================
  3. HEADINGS
==================================================*/

h1,
h2,
h3,
h4,
h5,
h6{

    font-family:var(--font-heading);

    font-weight:var(--font-weight-bold);

    line-height:var(--line-height-heading);

    color:var(--text-heading);

}

h1{
    font-size:var(--font-size-h1);
}

h2{
    font-size:var(--font-size-h2);
}

h3{
    font-size:var(--font-size-h3);
}

h4{
    font-size:var(--font-size-h4);
}

h5{
    font-size:var(--font-size-h5);
}

h6{
    font-size:var(--font-size-subtitle);
}
/*==================================================
  4. TEXT ELEMENTS
==================================================*/

p{

    margin-bottom:var(--space-4);

}

small{

    font-size:var(--font-size-small);

}

strong{

    font-weight:var(--font-weight-bold);

}

em{

    font-style:italic;

}

mark{

    background:var(--color-primary-soft);

    color:var(--text-heading);

    padding:2px 6px;

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

}
/*==================================================
  5. LISTS
==================================================*/

ul,
ol{

    padding-left:var(--space-6);

}

li{

    margin-bottom:var(--space-2);

}
/*==================================================
  6. LINKS
==================================================*/

a{

    color:var(--color-primary);

    transition:var(--transition-normal);

}

a:hover:not([class*="btn"]){

    color:var(--color-primary-hover);

}
/*==================================================
  7. TEXT UTILITIES
==================================================*/

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

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

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

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

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

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

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

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

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

.fw-400{
    font-weight:400;
}

.fw-500{
    font-weight:500;
}

.fw-600{
    font-weight:600;
}

.fw-700{
    font-weight:700;
}

.fw-800{
    font-weight:800;
}