For those that were looking to do the same, a colleague shared this with me:
Page template: Navigators - Tabbed Navigator
Code to be added to Script (optional properties)
Execute: "Every time page is used"
// JavaScript / jQuery
var acq1 = $("body").find("[aria-controls='tab1']");
var clb2 = $("body").find("[aria-controls='tab2']");
var dsc3 = $("body").find("[aria-controls='tab3']");
var inv4 = $("body").find("[aria-controls='tab4']");
var prc5 = $("body").find("[aria-controls='tab5']");
var prd6 = $("body").find("[aria-controls='tab6']");
acq1.css( "background-color", "#76DEF2");
clb2.css( "background-color", "#FFD21A");
dsc3.css( "background-color", "#85AEEA");
inv4.css( "background-color", "#F8807F");
prc5.css( "background-color", "#BB98DC");
prd6.css( "background-color", "#BDEA75");
Code to be added with Script (Optional Properties)
#ui-id-1, #ui-id-2, #ui-id-3, #ui-id-4, #ui-id-5, #ui-id-6, #ui-id-7, #ui-id-8{
color:black !important;
}
Hope that helps