Embedded Card UI Style Updates

We are altering the structure of our Card Embed UI HTML by deploying additional class attributes.

This will be released in Sandbox on January 13th and Prod-Live on January 15th. We do not expect any impact to the existing embed card functionality, however please review and make updates as needed.

Current HTML Attributes

<body>  
    <div id="card">  
        <div id="pan" onclick="copyToClip('pan')">9999<span class='pan-separator'></span>9999<span class='pan-separator'></span>9999<span class='pan-separator'></span>9999</div>  
        <div id="expiry">  
            <span id="month" onclick="copyToClip('month')">08</span>  
            <span id="separator">/</span>  
            <span id="year" onclick="copyToClip('year')">27</span>  
        </div>  
        <div id="cvv" onclick="copyToClip('cvv')">574</div>  
        <div id="alert" class="empty"></div>  
    </div>
  </body>
  </html>`

Updated HTML Attributes

<body>
    <div id="card" class="card">
        <div id="pan" class="pan" onclick="copyToClip('pan')">9999<span class='pan-separator'></span>9999<span class='pan-separator'></span>9999<span class='pan-separator'></span>9999</div>  
        <div id="expiry" class="expiry">
            <span id="month" class="month" onclick="copyToClip('month')">08</span>
            <span id="separator" class="separator">/</span>
            <span id="year" class="year" onclick="copyToClip('year')">27</span>
        </div>
        <div id="cvv" class="cvv" onclick="copyToClip('cvv')">574</div>
        <div id="alert" class="alert empty"></div>
    </div>
</body>
</html>