/* Refrigerant colours (AHRI, from pt.js HEADER_COLOURS). Shared by app/tools/ref-face.htm and app/index.htm.
   pt-face.js puts the class on the PT chart header (#pt-title); shsc-face.js puts it on the refrigerant button (#ref-name-hold). No inline style.
   Red stripe = flammable (A2L / A3 / B2L). Keep in step with HEADER_COLOURS. */
#pt-title.ref-colour-r-410a, #ref-name-hold.ref-colour-r-410a, #ref-name-hold.ref-colour-r-410a:hover { background: #D592AA !important; color: #000000 !important; }
#pt-title.ref-colour-r-32, #ref-name-hold.ref-colour-r-32, #ref-name-hold.ref-colour-r-32:hover { background: #3EB1C8 !important; color: #000000 !important; }
#pt-title.ref-colour-r-32 { border-bottom: 4px solid #E4002B; }
#ref-name-hold.ref-colour-r-32, #ref-name-hold.ref-colour-r-32:hover { border-bottom: 3px solid #E4002B; }
#pt-title.ref-colour-r-454b, #ref-name-hold.ref-colour-r-454b, #ref-name-hold.ref-colour-r-454b:hover { background: #B7B3A8 !important; color: #000000 !important; }
#pt-title.ref-colour-r-454b { border-bottom: 4px solid #E4002B; }
#ref-name-hold.ref-colour-r-454b, #ref-name-hold.ref-colour-r-454b:hover { border-bottom: 3px solid #E4002B; }
#pt-title.ref-colour-r-22, #ref-name-hold.ref-colour-r-22, #ref-name-hold.ref-colour-r-22:hover { background: #8FE2B0 !important; color: #000000 !important; }
#pt-title.ref-colour-r-407c, #ref-name-hold.ref-colour-r-407c, #ref-name-hold.ref-colour-r-407c:hover { background: #B86125 !important; color: #000000 !important; }
#pt-title.ref-colour-r-134a, #ref-name-hold.ref-colour-r-134a, #ref-name-hold.ref-colour-r-134a:hover { background: #99D6EA !important; color: #000000 !important; }
#pt-title.ref-colour-r-404a, #ref-name-hold.ref-colour-r-404a, #ref-name-hold.ref-colour-r-404a:hover { background: #FE5000 !important; color: #000000 !important; }
#pt-title.ref-colour-r-507a, #ref-name-hold.ref-colour-r-507a, #ref-name-hold.ref-colour-r-507a:hover { background: #00B2A9 !important; color: #000000 !important; }
#pt-title.ref-colour-r-1234yf { border-bottom: 4px solid #E4002B; }
#ref-name-hold.ref-colour-r-1234yf, #ref-name-hold.ref-colour-r-1234yf:hover { border-bottom: 3px solid #E4002B; }
#pt-title.ref-colour-r-1234ze-e- { border-bottom: 4px solid #E4002B; }
#ref-name-hold.ref-colour-r-1234ze-e-, #ref-name-hold.ref-colour-r-1234ze-e-:hover { border-bottom: 3px solid #E4002B; }
#pt-title.ref-colour-r-290 { border-bottom: 4px solid #E4002B; }
#ref-name-hold.ref-colour-r-290, #ref-name-hold.ref-colour-r-290:hover { border-bottom: 3px solid #E4002B; }
#pt-title.ref-colour-r-600a { border-bottom: 4px solid #E4002B; }
#ref-name-hold.ref-colour-r-600a, #ref-name-hold.ref-colour-r-600a:hover { border-bottom: 3px solid #E4002B; }
#pt-title.ref-colour-r-717 { border-bottom: 4px solid #E4002B; }
#ref-name-hold.ref-colour-r-717, #ref-name-hold.ref-colour-r-717:hover { border-bottom: 3px solid #E4002B; }
#pt-title.ref-colour-r-407a, #ref-name-hold.ref-colour-r-407a, #ref-name-hold.ref-colour-r-407a:hover { background: #78BE20 !important; color: #000000 !important; }
#pt-title.ref-colour-r-407f, #ref-name-hold.ref-colour-r-407f, #ref-name-hold.ref-colour-r-407f:hover { background: #CDEA80 !important; color: #000000 !important; }
#pt-title.ref-colour-r-448a, #ref-name-hold.ref-colour-r-448a, #ref-name-hold.ref-colour-r-448a:hover { background: #005EB8 !important; color: #FFFFFF !important; }
#pt-title.ref-colour-r-449a, #ref-name-hold.ref-colour-r-449a, #ref-name-hold.ref-colour-r-449a:hover { background: #00617F !important; color: #FFFFFF !important; }
#pt-title.ref-colour-r-450a, #ref-name-hold.ref-colour-r-450a, #ref-name-hold.ref-colour-r-450a:hover { background: #003865 !important; color: #FFFFFF !important; }
#pt-title.ref-colour-r-452a, #ref-name-hold.ref-colour-r-452a, #ref-name-hold.ref-colour-r-452a:hover { background: #171C8F !important; color: #FFFFFF !important; }
#pt-title.ref-colour-r-513a, #ref-name-hold.ref-colour-r-513a, #ref-name-hold.ref-colour-r-513a:hover { background: #0086BF !important; color: #000000 !important; }
#pt-title.ref-colour-r-12, #ref-name-hold.ref-colour-r-12, #ref-name-hold.ref-colour-r-12:hover { background: #FFFFFF !important; color: #000000 !important; }
#pt-title.ref-colour-r-11, #ref-name-hold.ref-colour-r-11, #ref-name-hold.ref-colour-r-11:hover { background: #FE5000 !important; color: #000000 !important; }
#pt-title.ref-colour-r-123, #ref-name-hold.ref-colour-r-123, #ref-name-hold.ref-colour-r-123:hover { background: #C1C6C8 !important; color: #000000 !important; }
#pt-title.ref-colour-r-245fa, #ref-name-hold.ref-colour-r-245fa, #ref-name-hold.ref-colour-r-245fa:hover { background: #9B2743 !important; color: #FFFFFF !important; }
#pt-title.ref-colour-r-417a, #ref-name-hold.ref-colour-r-417a, #ref-name-hold.ref-colour-r-417a:hover { background: #00B140 !important; color: #000000 !important; }
#pt-title.ref-colour-r-422d, #ref-name-hold.ref-colour-r-422d, #ref-name-hold.ref-colour-r-422d:hover { background: #97D700 !important; color: #000000 !important; }
#pt-title.ref-colour-r-427a, #ref-name-hold.ref-colour-r-427a, #ref-name-hold.ref-colour-r-427a:hover { background: #00AF66 !important; color: #000000 !important; }
#pt-title.ref-colour-r-438a, #ref-name-hold.ref-colour-r-438a, #ref-name-hold.ref-colour-r-438a:hover { background: #307FE2 !important; color: #000000 !important; }
#pt-title.ref-colour-r-125, #ref-name-hold.ref-colour-r-125, #ref-name-hold.ref-colour-r-125:hover { background: #B9975B !important; color: #000000 !important; }
#pt-title.ref-colour-r-502, #ref-name-hold.ref-colour-r-502, #ref-name-hold.ref-colour-r-502:hover { background: #DD9CDF !important; color: #000000 !important; }