@tailwind base;
@tailwind components;
@tailwind utilities;
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;800&display=swap');
@layer base {
     :root {
        overflow-y: scroll !important;
        --primary: #041c40;
        --secondary: #e06923;
        --tertiary: #313131;
        --bg-color: #F5EEE6;
        --text-color: #313131;
        --border-color: #d1c9be;
    }
    .dark {
        overflow-y: scroll !important;
        --primary: #041c40;
        --secondary: #e06923;
        --tertiary: #313131;
        --bg-color: #313131;
        --text-color: #F5EEE6;
        --border-color: #4a4a4a;
    }
    body {
        overflow-y: scroll !important;
        margin: 0;
        padding: 0;
        min-height: 100vh;
        width: 100vw;
        overflow-x: hidden;
        font-family: 'Cairo', system-ui, -apple-system, sans-serif;
        color: var(--text-color);
        transition: background-color 0.3s ease, color 0.3s ease;
    }
    html {
        overflow-y: scroll !important;
        scroll-behavior: smooth;
        overflow-x: hidden;
    }
}