.pro-swatches-wrapper {
vertical-align: top;
user-select: none; }
.pro-swatches-wrapper .hidden {
display: none !important; }
.pro-swatches-wrapper .pro-swatches-item {
display: inline-block;
margin-right: 10px;
margin-bottom: 10px;
position: relative;
text-align: center;
box-sizing: border-box;
vertical-align: middle;
cursor: pointer;
overflow: hidden; }
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-label {
width: auto !important;
border-radius: 8px !important; }
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-label div:first-child {
display: flex;
justify-content: center;
align-content: center;
align-items: center;
height: 100%;
width: 100%; }
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-color span {
display: block;
position: absolute;
background-color: #f44336; }
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-multi-color span:first-child,
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-multi-color span:nth-child(2) {
display: block;
position: absolute;
right: 50%;
background-color: #9C27B0; }
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-multi-color span:nth-child(2) {
left: 50%;
background-color: #4CAF50; }
.pro-swatches-wrapper .pro-swatches-item img {
max-width: 100%;
max-height: 100%; }
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-not-available {
cursor: no-drop; }
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-not-available:after {
content: "";
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(255, 255, 255, 0.7); }
.pro-swatches-wrapper .pro-swatches-item.pro-swatches-not-available:before {
content: "";
background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgZmlsbD0iI2Y0NDMzNiIgdmlld0JveD0iMCAwIDMyIDMyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjx0aXRsZS8+PGcgaWQ9IkZpbGwiPjxwb2x5Z29uIHBvaW50cz0iMjguNzEgNC43MSAyNy4yOSAzLjI5IDE2IDE0LjU5IDQuNzEgMy4yOSAzLjI5IDQuNzEgMTQuNTkgMTYgMy4yOSAyNy4yOSA0LjcxIDI4LjcxIDE2IDE3LjQxIDI3LjI5IDI4LjcxIDI4LjcxIDI3LjI5IDE3LjQxIDE2IDI4LjcxIDQuNzEiLz48L2c+PC9zdmc+);
display: block;
width: 20px;
height: 20px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -10px;
margin-top: -10px;
z-index: 99;
opacity: 0.6; }
.pro-swatches-tooltip {
position: absolute;
top: 0;
left: 0;
font-size: 12px;
padding: 4px 15px;
border-radius: 4px;
white-space: nowrap;
z-index: 999;
line-height: 24px; }
.pro-swatches-tooltip:after {
content: "";
position: absolute;
top: 100%;
width: 0;
height: 0;
left: 50%;
margin-left: -5px;
border-style: solid;
border-width: 5px 5px 0 5px; }