:root {
    --color-white: #ffffff;
    --color-black: #000000;

    --color-text: #1f2937;
    --color-text-light: #ffffff;

    --color-primary: #1d4ed8;
    --color-primary-hover: #2563eb;

    --glass-bg: rgba(255, 255, 255, 0.18);
    --glass-bg-hover: rgba(255, 255, 255, 0.28);
    --glass-border: rgba(255, 255, 255, 0.35);
    --glass-shadow: rgba(0, 0, 0, 0.12);

    --header-radius: 50px;
    --header-height: 76px;
}

@font-face {
    font-family: "Vazirmatn";
    src: url("../assets/fonts/Vazirmatn.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;

    font-family: "Vazirmatn", Tahoma, Arial, sans-serif;
}

body {
    font-family: "Vazirmatn", Tahoma, Arial, sans-serif;
    color: var(--color-text);
    background: #f5f5f5;
    
    overflow-x: hidden;
}

a {
    text-decoration: none;
    color: inherit;
}

button {
    font-family: inherit;
}

.app{
    overflow-x: hidden;
}

input, textarea{
    unicode-bidi: plaintext;
    text-align: start;
}

html.lang-en .production-features-container {
    direction: rtl;
}

html.lang-en .footer-content {
    text-align: left;
}

html.lang-en .info-content {
    direction: ltr;
    text-align: left;
}

html.lang-en textarea, html.lang-en input{
    direction: ltr;
}

html.lang-en .product-card{
    direction: rtl;
}
html.lang-en .product-card-content{
    direction: ltr;
}