html{ 
    font-size: 62.5%;  
    scroll-behavior: smooth; 
}

/* Light mode */
:root[data-bs-theme="light"] {
    --my-bg: #F5F7FA;
    --my-secondary-bg: #FFFFFF; 
    --my-text: #010101; 
    --my-subtext: #606060;

    --my-primary-btn-bg: #282a30;  
    --my-primary-btn-hover: #000000;  
    --my-primary-btn-text: #FFFFFF;  

    --my-secondary-btn-bg: #f1f1f1;  
    --my-secondary-btn-hover: #ecebeb;  
    --my-secondary-btn-text: #000000;  
    --my-secondary-btn-border: #dbdbdb;  

    --my-border-color: #e5e7eb;   
    --my-card-bg: #FFFFFF;  
    --my-secondary-card-bg: #F5F7FA;  
    --my-footer-bg: #ffffff;  
 
    --my-accent-color: #ffa500;
}

/* Dark mode */
:root[data-bs-theme="dark"] {
    --my-bg: #101010;
    --my-secondary-bg: #151515; 
    --my-text: #FFFFFF;  
    --my-subtext: #9F9F9F; 
  
    --my-primary-btn-bg: #e6e6e6;  
    --my-primary-btn-hover: #ffffff;  
    --my-primary-btn-text: #000000;  

    --my-secondary-btn-bg: #28282C;  
    --my-secondary-btn-hover: #22222a;  
    --my-secondary-btn-text: #FFFFFF;  
    --my-secondary-btn-border: #3E3E44;  

    --my-border-color: #1D1E1E;  
    --my-card-bg: #151515;  
    --my-secondary-card-bg: #101010;   
    --my-footer-bg: #000000;  

    --my-accent-color: #ffa500;
}