/*
 * Filename: _launcher-icon-mask.scss
 * FullPath: modules/projects/fl.ui/src/ui/speed-dial/_launcher-icon-mask.scss
 * Change date and time: 19.25.00_19.08.2026
 * Reason for changes: Shared Android icon mask — optical fill + wallpaper ink tokens.
 */

@layer components {
    /*
     * Native app glyph as a tinted silhouette (same ink as SpeedDial `ui-icon`).
     * Host sets `--launcher-app-icon-url`; theme sets `--icon-color` on env-shell-root.
     */
    .ui-ws-item-icon-mask[data-launcher-icon] {
        display: block;
        box-sizing: border-box;
        inline-size: var(--launcher-icon-size, var(--icon-size, 2.2rem));
        block-size: var(--launcher-icon-size, var(--icon-size, 2.2rem));
        flex-shrink: 0;
        background-color: var(--icon-color, var(--sd-figure-ink, currentColor));
        color: var(--icon-color, var(--sd-figure-ink, currentColor));
        -webkit-mask-image: var(--launcher-app-icon-url);
        mask-image: var(--launcher-app-icon-url);
        /* WHY: adaptive icons ship with outer safe-zone padding — scale up for ui-icon visual weight. */
        -webkit-mask-size: calc(100% * var(--launcher-icon-mask-scale, 1.1));
        mask-size: calc(100% * var(--launcher-icon-mask-scale, 1.1));
        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
        -webkit-mask-position: center;
        mask-position: center;
        -webkit-mask-origin: center;
        mask-origin: center;
        filter: drop-shadow(0 1px 2px color-mix(in oklab, #000 14%, transparent));
    }
}