function applyStylesToModal()

in public/content.js [420:457]


function applyStylesToModal(modal, styles) {
  const allowedSelectors = [
    '#resVaultModalContent',
    "#resVaultMessageBox",
    '#amountDisplay',
    '#resVaultModalClose',
    '#resVaultModalSubmit',
    '#customMessage',
    '#poweredBy',
  ];

  const allowedStyles = {
    '#resVaultModalContent': ['background-color', 'padding', 'border-radius', 'box-shadow', 'font-family', 'width', 'position', 'top', 'left', 'transform', 'z-index'],
    '#amountDisplay': ['color', 'font-size', 'text-align', 'border', 'background-color', 'padding', 'border-radius'],
    '#resVaultMessageBox': ['width', 'padding', 'background-color', 'border-radius', 'margin-bottom', 'box-shadow'],
    '#resVaultModalClose': ['background-color', 'color', 'border', 'padding', 'border-radius', 'cursor', 'width'],
    '#resVaultModalSubmit': ['background-color', 'color', 'border', 'padding', 'border-radius', 'cursor', 'width'],
    '#customMessage': ['color', 'font-size', 'text-align', 'background-color', 'padding', 'border-radius'],
    '#poweredBy': ['color', 'font-size', 'text-align'],
  };

  for (const selector in styles) {
    if (!allowedSelectors.includes(selector)) {
      continue; // Skip disallowed selectors
    }
    const elements = modal.querySelectorAll(selector);
    elements.forEach(element => {
      const styleObj = styles[selector];
      const allowedProperties = allowedStyles[selector] || [];
      for (const styleName in styleObj) {
        if (allowedProperties.includes(styleName)) {
          // Apply the style with !important to ensure precedence
          element.style.setProperty(styleName, styleObj[styleName], 'important');
        }
      }
    });
  }
}