/*
 * Ama Care WYSIWYG Icons
 * Version 1.2.0
 *
 * Icons are inserted as inline <span> elements and displayed through SVG masks.
 * This keeps the icon color controllable from CSS and lets the icons behave like text symbols.
 */

.ama-care-icon {
    --ama-care-icon-size: 1.45em;
    --ama-care-icon-color: #662132;

    display: inline-block;
    width: var(--ama-care-icon-size);
    height: var(--ama-care-icon-size);
    min-width: var(--ama-care-icon-size);
    vertical-align: -0.32em;
    line-height: 1;
    background-color: var(--ama-care-icon-color);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

/* Optional: add this class to a parent if icons should inherit the surrounding text color. */
.ama-care-icons-current-color .ama-care-icon {
    --ama-care-icon-color: currentColor;
}

.ama-care-icon--wash30 {
    -webkit-mask-image: url("../svg/wash30.svg");
    mask-image: url("../svg/wash30.svg");
}

.ama-care-icon--insideout {
    -webkit-mask-image: url("../svg/insideout.svg");
    mask-image: url("../svg/insideout.svg");
}

.ama-care-icon--no-bleach-softener {
    -webkit-mask-image: url("../svg/no-bleach-softener.svg");
    mask-image: url("../svg/no-bleach-softener.svg");
}

.ama-care-icon--low-spin {
    -webkit-mask-image: url("../svg/low-spin.svg");
    mask-image: url("../svg/low-spin.svg");
}

.ama-care-icon--no-iron {
    -webkit-mask-image: url("../svg/no-iron.svg");
    mask-image: url("../svg/no-iron.svg");
}

.woocommerce-product-details__short-description .ama-care-icon,
.entry-content .ama-care-icon {
    margin-right: 0.25em;
}

body#tinymce .ama-care-icon {
    cursor: text;
}
