Migrate box shadow utils to Tailwind

What does this MR do and why?

Migrates several box shadow utilities to Tailwind.

MR acceptance checklist

Please evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Screenshots or screen recordings

Here are just a couple examples:

Environment details

Admin area > Runner

How to set up and validate locally

1. Here's how the CSS-in-Js gets changed by running this snippet after the changes:

   diff --git a/config/helpers/tailwind/css_in_js.js b/config/helpers/tailwind/css_in_js.js
   index 06c1b98e3963..812e1e0b858f 100644
   --- a/config/helpers/tailwind/css_in_js.js
   +++ b/config/helpers/tailwind/css_in_js.js
   @@ -1,5 +1,5 @@
    /**
   - * The following 631 definitions need to be migrated to Tailwind.
   + * The following 620 definitions need to be migrated to Tailwind.
     * Let's do this! 🚀
     */
    module.exports = {
   @@ -144,37 +144,20 @@ module.exports = {
      },
      '.rounded-top-left-small': { 'border-top-left-radius': '0.125rem' },
      '.rounded-top-right-small': { 'border-top-right-radius': '0.125rem' },
   -  '.inset-border-1-gray-100': { 'box-shadow': 'inset 0 0 0 1px var(--gray-100, #dcdcde)' },
      '.inset-border-1-gray-100\\!': {
        'box-shadow': 'inset 0 0 0 1px var(--gray-100, #dcdcde) !important',
      },
   -  '.inset-border-1-gray-200': { 'box-shadow': 'inset 0 0 0 1px var(--gray-200, #bfbfc3)' },
   -  '.inset-border-1-gray-200\\!': {
   -    'box-shadow': 'inset 0 0 0 1px var(--gray-200, #bfbfc3) !important',
   -  },
      '.inset-border-1-gray-400': { 'box-shadow': 'inset 0 0 0 1px var(--gray-400, #89888d)' },
      '.inset-border-1-gray-400\\!': {
        'box-shadow': 'inset 0 0 0 1px var(--gray-400, #89888d) !important',
      },
   -  '.inset-border-l-4-gray-100': { 'box-shadow': 'inset 4px 0 0 0 var(--gray-100, #dcdcde)' },
   -  '.inset-border-1-blue-500': { 'box-shadow': 'inset 0 0 0 1px var(--blue-500, #1f75cb)' },
      '.focus-inset-border-2-blue-400\\!': {
        '&:focus': { 'box-shadow': 'inset 0 0 0 2px var(--blue-400, #428fdc) !important' },
      },
   -  '.inset-border-1-red-400\\!': {
   -    'box-shadow': 'inset 0 0 0 1px var(--red-400, #ec5941) !important',
   -  },
   -  '.inset-border-1-red-500': { 'box-shadow': 'inset 0 0 0 1px var(--red-500, #dd2b0e)' },
      '.inset-border-1-red-500\\!': {
        'box-shadow': 'inset 0 0 0 1px var(--red-500, #dd2b0e) !important',
      },
   -  '.inset-border-l-3-red-600': { 'box-shadow': 'inset 3px 0 0 0 var(--red-600, #c91c00)' },
   -  '.inset-border-b-2-theme-accent': {
   -    'box-shadow': 'inset 0 -2px 0 0 var(--gl-theme-accent, var(--theme-indigo-500, #6666c4))',
   -  },
      '.shadow-none\\!': { 'box-shadow': 'none !important' },
   -  '.shadow-x0-y2-b4-s0': { 'box-shadow': '0 2px 4px 0 #0000001a' },
   -  '.shadow-x0-y0-b3-s1-blue-500': { 'box-shadow': 'inset 0 0 3px 1px var(--blue-500, #1f75cb)' },
      '.clearfix': { '&::after': { display: 'block', clear: 'both', content: '""' } },
      '.clearfix\\!': {
        '&::after': { display: 'block !important', clear: 'both !important', content: '"" !important' },

Related to #456621