/**
 * CSS-класс для добавления SVG-иконки монетки к концу строчного элемента.
 * Иконка масштабируется под высоту строки (1em) и наследует цвет текста родителя.
 * Использование: добавьте класс .coin к любому строчному или блочному элементу.
 */
.coin {
    position: relative;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    color: inherit; /* Наследует цвет текста */
}

.coin::after {
    content: '';
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    margin-left: 0.2em;
    margin-right: 0.2em;
    margin-top: -0.1em;
    background-color: currentColor; /* Цвет иконки равен цвету текста родителя */
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.99998 3.33337C9.72798 3.33337 11.324 3.64337 12.5133 4.17204C13.1066 4.43604 13.6293 4.76737 14.0113 5.16937C14.3973 5.57337 14.6666 6.08137 14.6666 6.66671V9.33337C14.6666 9.91871 14.3973 10.426 14.0113 10.8307C13.6293 11.2327 13.1073 11.564 12.5133 11.828C11.324 12.3567 9.72798 12.6667 7.99998 12.6667C6.27198 12.6667 4.67598 12.3567 3.48665 11.828C2.89331 11.564 2.37065 11.2327 1.98865 10.8307C1.60265 10.4267 1.33331 9.91871 1.33331 9.33337V6.66671C1.33331 6.08137 1.60265 5.57404 1.98865 5.16937C2.37065 4.76737 2.89265 4.43604 3.48665 4.17204C4.67598 3.64337 6.27198 3.33337 7.99998 3.33337ZM13.3333 8.72004C13.0833 8.88404 12.8066 9.03071 12.5133 9.16137C11.324 9.69004 9.72798 10 7.99998 10C6.27198 10 4.67598 9.69004 3.48665 9.16137C3.20191 9.03651 2.92769 8.88892 2.66665 8.72004V9.33337C2.66665 9.48471 2.73331 9.67871 2.95465 9.91204C3.17931 10.148 3.53598 10.3914 4.02798 10.61C5.01065 11.0467 6.41465 11.3334 7.99998 11.3334C9.58598 11.3334 10.9893 11.0467 11.972 10.61C12.464 10.3914 12.8206 10.148 13.0453 9.91204C13.2673 9.67871 13.3333 9.48471 13.3333 9.33337V8.72004ZM7.99998 4.66671C6.41398 4.66671 5.01065 4.95337 4.02798 5.39004C3.53598 5.60871 3.17931 5.85204 2.95465 6.08804C2.73265 6.32137 2.66665 6.51537 2.66665 6.66671C2.66665 6.81804 2.73331 7.01204 2.95465 7.24537C3.17931 7.48137 3.53598 7.72471 4.02798 7.94337C5.01065 8.38004 6.41465 8.66671 7.99998 8.66671C9.58598 8.66671 10.9893 8.38004 11.972 7.94337C12.464 7.72471 12.8206 7.48137 13.0453 7.24537C13.2673 7.01204 13.3333 6.81804 13.3333 6.66671C13.3333 6.51537 13.2666 6.32137 13.0453 6.08804C12.8206 5.85204 12.464 5.60871 11.972 5.39004C10.9893 4.95404 9.58531 4.66671 7.99998 4.66671Z' fill='black'/%3E%3C/svg%3E");
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    /* Fallback для браузеров без поддержки mask-image */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.99998 3.33337C9.72798 3.33337 11.324 3.64337 12.5133 4.17204C13.1066 4.43604 13.6293 4.76737 14.0113 5.16937C14.3973 5.57337 14.6666 6.08137 14.6666 6.66671V9.33337C14.6666 9.91871 14.3973 10.426 14.0113 10.8307C13.6293 11.2327 13.1073 11.564 12.5133 11.828C11.324 12.3567 9.72798 12.6667 7.99998 12.6667C6.27198 12.6667 4.67598 12.3567 3.48665 11.828C2.89331 11.564 2.37065 11.2327 1.98865 10.8307C1.60265 10.4267 1.33331 9.91871 1.33331 9.33337V6.66671C1.33331 6.08137 1.60265 5.57404 1.98865 5.16937C2.37065 4.76737 2.89265 4.43604 3.48665 4.17204C4.67598 3.64337 6.27198 3.33337 7.99998 3.33337ZM13.3333 8.72004C13.0833 8.88404 12.8066 9.03071 12.5133 9.16137C11.324 9.69004 9.72798 10 7.99998 10C6.27198 10 4.67598 9.69004 3.48665 9.16137C3.20191 9.03651 2.92769 8.88892 2.66665 8.72004V9.33337C2.66665 9.48471 2.73331 9.67871 2.95465 9.91204C3.17931 10.148 3.53598 10.3914 4.02798 10.61C5.01065 11.0467 6.41465 11.3334 7.99998 11.3334C9.58598 11.3334 10.9893 11.0467 11.972 10.61C12.464 10.3914 12.8206 10.148 13.0453 9.91204C13.2673 9.67871 13.3333 9.48471 13.3333 9.33337V8.72004ZM7.99998 4.66671C6.41398 4.66671 5.01065 4.95337 4.02798 5.39004C3.53598 5.60871 3.17931 5.85204 2.95465 6.08804C2.73265 6.32137 2.66665 6.51537 2.66665 6.66671C2.66665 6.81804 2.73331 7.01204 2.95465 7.24537C3.17931 7.48137 3.53598 7.72471 4.02798 7.94337C5.01065 8.38004 6.41465 8.66671 7.99998 8.66671C9.58598 8.66671 10.9893 8.38004 11.972 7.94337C12.464 7.72471 12.8206 7.48137 13.0453 7.24537C13.2673 7.01204 13.3333 6.81804 13.3333 6.66671C13.3333 6.51537 13.2666 6.32137 13.0453 6.08804C12.8206 5.85204 12.464 5.60871 11.972 5.39004C10.9893 4.95404 9.58531 4.66671 7.99998 4.66671Z' fill='black'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    vertical-align: middle;
}

/* Если браузер поддерживает mask-image, переопределяем background-image */
@supports (mask-image: url('')) or (-webkit-mask-image: url('')) {
    .coin::after {
        background-image: none;
        background-color: currentColor;
    }
}

/* Вариант с изменением цвета через CSS переменную */
.coin.custom-color::after {
    filter: brightness(0) saturate(100%) invert(var(--icon-color, 1)) sepia(1) saturate(10000%) hue-rotate(var(--icon-hue, 0deg));
}

/* Альтернативный вариант через маску (поддержка цветов через background-color) */
.coin.mask-icon::after {
    background-color: currentColor;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.99998 3.33337C9.72798 3.33337 11.324 3.64337 12.5133 4.17204C13.1066 4.43604 13.6293 4.76737 14.0113 5.16937C14.3973 5.57337 14.6666 6.08137 14.6666 6.66671V9.33337C14.6666 9.91871 14.3973 10.426 14.0113 10.8307C13.6293 11.2327 13.1073 11.564 12.5133 11.828C11.324 12.3567 9.72798 12.6667 7.99998 12.6667C6.27198 12.6667 4.67598 12.3567 3.48665 11.828C2.89331 11.564 2.37065 11.2327 1.98865 10.8307C1.60265 10.4267 1.33331 9.91871 1.33331 9.33337V6.66671C1.33331 6.08137 1.60265 5.57404 1.98865 5.16937C2.37065 4.76737 2.89265 4.43604 3.48665 4.17204C4.67598 3.64337 6.27198 3.33337 7.99998 3.33337ZM13.3333 8.72004C13.0833 8.88404 12.8066 9.03071 12.5133 9.16137C11.324 9.69004 9.72798 10 7.99998 10C6.27198 10 4.67598 9.69004 3.48665 9.16137C3.20191 9.03651 2.92769 8.88892 2.66665 8.72004V9.33337C2.66665 9.48471 2.73331 9.67871 2.95465 9.91204C3.17931 10.148 3.53598 10.3914 4.02798 10.61C5.01065 11.0467 6.41465 11.3334 7.99998 11.3334C9.58598 11.3334 10.9893 11.0467 11.972 10.61C12.464 10.3914 12.8206 10.148 13.0453 9.91204C13.2673 9.67871 13.3333 9.48471 13.3333 9.33337V8.72004ZM7.99998 4.66671C6.41398 4.66671 5.01065 4.95337 4.02798 5.39004C3.53598 5.60871 3.17931 5.85204 2.95465 6.08804C2.73265 6.32137 2.66665 6.51537 2.66665 6.66671C2.66665 6.81804 2.73331 7.01204 2.95465 7.24537C3.17931 7.48137 3.53598 7.72471 4.02798 7.94337C5.01065 8.38004 6.41465 8.66671 7.99998 8.66671C9.58598 8.66671 10.9893 8.38004 11.972 7.94337C12.464 7.72471 12.8206 7.48137 13.0453 7.24537C13.2673 7.01204 13.3333 6.81804 13.3333 6.66671C13.3333 6.51537 13.2666 6.32137 13.0453 6.08804C12.8206 5.85204 12.464 5.60871 11.972 5.39004C10.9893 4.95404 9.58531 4.66671 7.99998 4.66671Z' fill='black'/%3E%3C/svg%3E");
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    background-image: none;
}

/* Размеры */
.coin.small::after {
    width: 0.75em;
    height: 0.75em;
}

.coin.large::after {
    width: 1.5em;
    height: 1.5em;
}

/* Позиционирование */
.coin.before::after {
    order: -1;
    margin-left: 0;
    margin-right: 0.2em;
}

.coin.after::after {
    order: 1;
    margin-left: 0.2em;
    margin-right: 0;
}