:root {
    --firstColor: #4E2529;  /* Changed */
    --secondColor: #b8a7a9;  /* Changed */
    --thirdColor: #7a5d60;  /* Complementary medium tone */
    
    --navBGColor: #b8a7a9;  /* Changed */
    --footerBG: #b8a7a9;  /* Changed */
    
    --textColor: #2d2d2d;
    --footertextColor: var(--textColor);
    --footertextHoverColor: var(--firstColor);   
    --menuTextColor: var(--textColor);
    --menuTextHoverColor: var(--firstColor);
--menuBurgerColor: var(--firstColor);
    
    --inputBorderColor: #b8a7a9;  /* Changed */
    --svgIconColor: #7a5d60;  /* Changed */
    --svgIconSelectedColor: #4E2529;  /* Changed */
    
    --footerActiveBtnBg: #b8a7a9;  /* Changed */
    --buttonBg: #4E2529;  /* Changed */
    --fourTabsBg: #4E2529;  /* Changed */
    --myOrdersTabsBg: #4E2529;  /* Changed */
    
    --gradient: linear-gradient(135deg, #4E2529 0%, #b8a7a9 100%);  /* Changed */
    --gradient2: linear-gradient(0deg, #4E2529 0%, #b8a7a9 100%);  /* Changed */
    --gradient3: linear-gradient(0deg, #4E2529 0%, #b8a7a9 100%);  /* Changed */
    
    --tabHoverColor: #e8e0e1;  
    --gramOptionBgGradient: linear-gradient(0deg, #4E2529 0%, #b8a7a9 100%);  /* Changed */
    --gramOptionSelectedBgGradient: linear-gradient(0deg, #4E2529 0%, #4E2529 100%);  /* Changed */
    
    --topNavSvgColor: #000;  
    --topNavSvgSelectedColor: #000;  
    
    --heartColor: #4E2529;  /* Changed */
    --heartSelectedColor: #8b1e25;  /* Slightly brighter red accent */
    
    --coinsBalanceBoxBG: #b8a7a9;  /* Changed */
    --imgBorder: #ccc;       
    --white: #fff;     
    --black: #000;   
    
    --opt4-primary-color: #3a1a1d; /* darker complementary tone */
}