@import "tailwindcss";
@custom-variant dark (&:where(.dark, .dark *));

:root {
    --color-primary: #7f4629;
    --color-button1: #99582a;

    --color-header: #f3efe7;
    --color-header2: #e6dbcc;

    --color-sidebar: #efeeee;

    --color-background: #fdf8f4;


    --font-sans: "Vazirmatn", system-ui, sans-serif;
    
}

.dark {
    --color-primary: #d9cab3;
    --color-button1: #99582a;

    --color-header: #342e2c;
    --color-header2: #5e5450;

    --color-sidebar: #564c49;

    --color-background: #272322;
}

/* Chrome / Edge / Safari autofill FIX (light + dark, no color) */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:focus,
select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #fdf8f4 inset !important;
  box-shadow: 0 0 0 1000px #fdf8f4 inset !important;
  -webkit-text-fill-color: inherit !important;
}

.dark input:-webkit-autofill,
.dark input:-webkit-autofill:hover,
.dark input:-webkit-autofill:focus,
.dark textarea:-webkit-autofill,
.dark textarea:-webkit-autofill:focus,
.dark select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px #272322 inset !important;
  box-shadow: 0 0 0 1000px #272322 inset !important;
  -webkit-text-fill-color: inherit !important;
}






html {
    font-family: var(--font-sans);
}

body {
    background-color: var(--background);
    color: var(--foreground);
    line-height: 1.6;
    /* فاصله مناسب خطوط متن */
    -webkit-font-smoothing: antialiased;
    /* نرم‌تر شدن فونت */
    text-rendering: optimizeLegibility;
    /* خوانایی بهتر متن */
}


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

@theme {
    --font-MyEstedad: "MyEstedad", sans-serif;

    --color-primary: var(--color-primary);
    --color-header: var(--color-header);
    --color-sidebar: var(--color-sidebar);
    --color-background: var(--color-background);

    --color-button1: var(--color-button1);

    /* --color-text1: var(--color-text1-menu-and-card);
    --color-text2: var(--color-text2);
    --color-text3: var(--color-text3);
    --color-text4: var(--color-text4);

    --color-btn1: var(--color-button1);
    --color-btn2: var(--color-button2);
    --color-btn3: var(--color-button3);

    --color-primary1: var(--color-primary1);
    --color-primary2: var(--color-primary2);
    --color-primary3: var(--color-primary3);
    --color-primary4: var(--color-primary4);
    --color-primary5-dark: var(--color-primary5-dark);
    --color-primary6-dark: var(--color-primary6-dark);


    --color-bg-light: var(--color-background-light);
    --color-bg-dark: var(--color-background-dark); */
}

@layer base {
    html {
        direction: rtl;
    }

    body {
        /* @apple font-MyEstedad; */
        font-family: var(--font-MyEstedad);
        direction: rtl;
    }
}



*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


/* دکمه‌ها فونت پروژه رو بگیرن */
button {
    font-family: inherit;
    cursor: pointer;
}

/* تصاویر و مدیاها ریسپانسیو باشن */
img,
picture,
video,
canvas,
svg {
    display: block;
    max-width: 100%;
}

/* رنگ انتخاب متن (drag select) */
::selection {
    background-color: var(--primary-200);
    /* بک‌گراند انتخاب */
    color: var(--primary-foreground);
    /* رنگ متن انتخاب */
}