:root {
--svg-clr-ico :#6d6f73;
--svg-clr-icon: #fff;
--svg-clr-icon-def:#fbd631;
--svg-clr-icon-heart:#fb3131;
--svg-star: url('data:image/svg+xml,');
--svg-star-full: url('data:image/svg+xml,');
--svg-heart: url('data:image/svg+xml,');
--svg-heart-full: url('data:image/svg+xml,');
--svg-eye: url('data:image/svg+xml,');
--svg-eye-slash: url('data:image/svg+xml,');
--svg-cutlery: url('data:image/svg+xml,');
--svg-folder-tree: url('data:image/svg+xml,');
--svg-nocheck: url('data:image/svg+xml,');
--svg-check: url('data:image/svg+xml,');
--svg-param: url('data:image/svg+xml,');
--svg-three-dots: url('data:image/svg+xml,');
--svg-circle-plus: url('data:image/svg+xml,');
--svg-square-plus: url('data:image/svg+xml,');
--svg-circle-minus: url('data:image/svg+xml,');
--svg-circle-check: url('data:image/svg+xml,');
--svg-circle-exit: url('data:image/svg+xml,');
--svg-checkbox: url('data:image/svg+xml,');
--svg-checkbox-checked: url('data:image/svg+xml,');
--svg-: url('data:image/svg+xml,');
}
/***** icones *****/
.inputCheck {
border: 0;
width: 1px;
height: 1px;
overflow: hidden;
position: absolute !important;
opacity: 0;
}
.mv-iconsvg {
position: relative;
color: var(--svg-clr-ico);
}
.mv-iconsvg:before {
display: inline-block;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
cursor: pointer;
--svg-clr: var(--svg-clr-ico);
content: "";
mask-image: var(--svg-main);
-webkit-mask-image: var(--svg-main);
width: 32px;
height: 32px;
background-color: var(--svg-clr-ico);
mask-repeat: no-repeat;
mask-size: contain;
top: 2px;
position: relative;
/* opacity: 0.8; */
}
.mv-checked {
--svg-main: var(--svg-checkbox);
}
.mv-checked.checked {
--svg-main: var(--svg-checkbox-checked);
}
.iconSvg {
position: relative;
float: right;
color: var(--svg-clr-icon);
}
label.iconSvg:before {
display: inline-block;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
cursor: pointer;
--svg-clr: var(--svg-clr-icon);
content: "";
mask-image: var(--svg-main);
-webkit-mask-image: var(--svg-main);
width: 32px;
height: 32px;
background-color: var(--svg-clr);
mask-repeat: no-repeat;
mask-size: contain;
opacity: 0.8;
}
label.iconStar:before {
content: "";
--svg-main: var(--svg-star);
}
label.iconHeart:before {
content: "";
--svg-main: var(--svg-heart);
}
label.iconEye:before {
content: "";
--svg-main: var(--svg-eye);
}
label.iconCutlery:before {
content: "";
--svg-main: var(--svg-cutlery);
left: -10px;
position: relative;
top: 7px;
}
label.iconFolderTree:before {
content: "";
--svg-main: var(--svg-folder-tree);
left: -10px;
position: relative;
top: 7px;
}
/* .cs_filtre .favori:hover label {
color: #fbd631;
}
.cs_filtre .favori:hover label:before {
--svg-clr: #fbd631;
opacity: 1;;
} */
input.inputCheck:checked + label.iconStar:before {
--svg-clr: var(--svg-clr-icon-def);
--svg-main: var(--svg-star-full);
opacity: 1;
}
input.inputCheck:checked + label.iconHeart:before {
--svg-clr: var(--svg-clr-icon-heart);
--svg-main: var(--svg-heart-full);
opacity: 1;
}
input.inputCheck:checked + label.iconEye:before {
content: "";
--svg-main: var(--svg-eye-slash);
--svg-clr: var(--svg-clr-icon);
opacity: 1;
}
input.inputCheck:checked + label.iconCutlery {
color: var(--svg-clr-icon-def);
}
input.inputCheck:checked + label.iconCutlery:before {
--svg-clr: var(--svg-clr-icon-def);
opacity: 1;
}
input.inputCheck:checked + label.iconFolderTree {
color: var(--svg-clr-icon-def);
}
input.inputCheck:checked + label.iconFolderTree:before {
--svg-clr: var(--svg-clr-icon-def);
opacity: 1;
}
/***** icones *****/