:root{
    --color-primary: #FF9933;
    --color-primary-light: #FFB366;
    --color-secondary: #138808;
    --color-white: #FFFFFF;
    --color-light-gray: #F5F5F5;
    --color-dark-text: #1F2937;
}

/* fallback gradient class in case Tailwind gradient utilities don't resolve custom colors */
.bg-brand-gradient{
    background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
}

/* radial gradient from primary to white */
.bg-primary-radial{
    background: radial-gradient(circle,rgba(255, 255, 255, 1) 0%, rgba(220, 252, 231, 1) 100%);
}

/* Off-canvas sliding menu */
.slide-menu {
    position: fixed;
    top: 0;
    right: -320px;
    width: 320px;
    height: 100vh;
    background: var(--color-white);
    box-shadow: -10px 0 30px rgba(0,0,0,0.15);
    transition: right 0.28s ease-in-out;
    z-index: 60;
    padding: 1rem;
}
.slide-menu.open {
    right: 0;
}
.slide-menu .close-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 9999px;
    background: var(--color-light-gray);
}

/* Dim overlay when menu open */
.menu-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease-in-out;
    z-index: 50;
}
.menu-overlay.open{
    opacity: 1;
    pointer-events: auto;
}

body {
    font-family: 'Inter', 'Noto Sans Tamil', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
    color: var(--color-dark-text);
    background-color: var(--color-white);
}

.head-font{
    font-family: 'Poppins', sans-serif;
}

/* Use Noto Sans Tamil for Tamil script blocks */
.tamil {
    font-family: 'Noto Sans Tamil', 'Inter', sans-serif;
}