/* Elementor 3 fixes */

/* Fixes common issues highlighted in 
 * - https://kurtosys-prod-eng.atlassian.net/browse/WP-9471
 * - https://kurtosys-prod-eng.atlassian.net/wiki/spaces/DXM/pages/3858956490/Elementor+3+issue+classification
 * 
 * Copy & paste file contents to your global theme CSS adjusting values as necessary.
 */

/* Fix hardcoded svg image width 
 * Removes the specfic pixel width in favour of 100% width
 * https://github.com/elementor/elementor/issues/11031
 */
 .elementor-widget-image .elementor-image > a img[src$='.svg'],
 .elementor-widget-image .elementor-image figure > a img[src$='.svg'] {
     width: 100%;
 }
 
 /* 
  * Fix social icon sizes
  * Use custom property defined on wrapper in place of static font size
  */
 .elementor-icon.elementor-social-icon {
     font-size: var(--icon-size);
     width: auto;
 }
 
 /* Fix divider border color
  * Use custom property --divider-color defined on wrapper
  */
 .elementor-widget-divider:not(.elementor-widget-divider--view-line_text):not(.elementor-widget-divider--view-line_icon)
     .elementor-divider-separator {
     border-top: var(--divider-border-width) var(--divider-border-style)
         var(--divider-color);
 }
 
 /* Fix share button colors
  * Use custom properties defined on wrapper in place of static values
  */
 .elementor-share-buttons--color-custom.elementor-share-buttons--skin-flat
     .elementor-share-btn,
 .elementor-share-buttons--color-custom.elementor-share-buttons--skin-gradient
     .elementor-share-btn {
     background-color: var(--e-share-buttons-primary-color);
     color: var(--e-share-buttons-secondary-color);
 }
 
 /* Fix grid gaps
  * Adds gaps as defined in custom properties on wrapper
  */
 .elementor-grid {
     column-gap: var(--grid-column-gap);
     row-gap: var(--grid-row-gap);
     align-items: center;
 }
 
 /* Fix share buttons horizontal alignment */
 .elementor-grid-0 .elementor-grid {
     width: auto;
 }
 
 /* Fix share buttons vertical alignment */
 .elementor-grid-0 .elementor-grid .elementor-grid-item {
     vertical-align: middle;
 }
 
 /* Fix icon list alignment 
  * Reverts to previous default values
  */
 .elementor-widget-icon-list {
     --e-icon-list-icon-margin: 0;
 }
 .elementor-widget .elementor-icon-list-item,
 .elementor-widget .elementor-icon-list-item a {
     align-items: flex-start;
 }
 .elementor-widget .elementor-icon-list-icon {
     display: block;
     flex-shrink: 0;
 }
 
 /* Fix icon height
  * Reverts auto height applied by default.
  * This is keyword not currently well supported, so it may be neccessary to provide a height here or fix with custom CSS per widget use.
  * https://developer.mozilla.org/en-US/docs/Web/CSS/revert-layer
  */
 .elementor-button-icon svg {
     height: revert-layer;
     /* height: 1em; */
 }