:root {
    --admonition-icon--file: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M3 3a2 2 0 0 1 2-2h9.982a2 2 0 0 1 1.414.586l4.018 4.018A2 2 0 0 1 21 7.018V21a2 2 0 0 1-2 2H4.75a.75.75 0 0 1 0-1.5H19a.5.5 0 0 0 .5-.5V8.5h-4a2 2 0 0 1-2-2v-4H5a.5.5 0 0 0-.5.5v6.25a.75.75 0 0 1-1.5 0Zm12-.5v4a.5.5 0 0 0 .5.5h4a.5.5 0 0 0-.146-.336l-4.018-4.018A.5.5 0 0 0 15 2.5Z"></path><path d="M4.53 12.24a.75.75 0 0 1-.039 1.06l-2.639 2.45 2.64 2.45a.75.75 0 1 1-1.022 1.1l-3.23-3a.75.75 0 0 1 0-1.1l3.23-3a.75.75 0 0 1 1.06.04Zm3.979 1.06a.75.75 0 1 1 1.02-1.1l3.231 3a.75.75 0 0 1 0 1.1l-3.23 3a.75.75 0 1 1-1.021-1.1l2.639-2.45-2.64-2.45Z"></path></svg>');
    
    --admonition-color-fg--file: #00c853;
    --admonition-color-bg--file: #00c8531a;
}

.md-typeset .admonition.file,
.md-typeset details.file {
    border-color: var(--admonition-color-fg--file);
}

.md-typeset .file > .admonition-title,
.md-typeset .file > summary {
    background-color: var(--admonition-color-bg--file);
}

.md-typeset .file > .admonition-title::before,
.md-typeset .file > summary::before {
    background-color: var(--admonition-color-fg--file);
    -webkit-mask-image: var(--admonition-icon--file);
            mask-image: var(--admonition-icon--file);
}