:root { --ui-scale: 0.8; --color-primary: #F16744; --color-primary-dark: #D94E2E; --color-primary-light: #FEF0EC; --color-pink: #E5438C; --color-pink-light: #FDE8F1; --color-green: #5E9947; --color-green-light: #EEF6EB; --color-blue: #38BFC2; --color-blue-light: #E8F8F8; --color-accent: #5E9947; --color-danger: #EF4444; --color-bg: #F1F5F9; --color-card: #FFFFFF; --border-radius: calc(12px * var(--ui-scale)); --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.08); --font-family: 'Figtree', 'Mandali', sans-serif; --font-telugu: 'Mandali', 'Figtree', sans-serif; --font-telugu-scale: 1.05; --input-min-height: 38px; --btn-height: 38px; --container-max: calc(1440px * var(--ui-scale)); } html { font-size: calc(16px * var(--ui-scale)); } body { font-family: var(--font-family); } /* Telugu fields/columns use Mandali. Do NOT target [lang="te"] on — that forced Mandali onto Latin UI text. Body stack is Figtree → Mandali, so Telugu glyphs still fall back to Mandali. */ .font-telugu, .dt-col-name-te, .dt-col-name-te .dt-master-text, input[name$="_te"], textarea[name$="_te"], #name_te { font-family: var(--font-telugu); font-weight: 400; font-size: 14px; line-height: 1.55; } input:not([type="checkbox"]):not([type="radio"]), select, textarea { min-height: var(--input-min-height); } /* Custom select chevron — hide Tailwind Forms / native arrow when using overlay icon */ select.select-chevron { -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: none !important; } .material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; }