@charset "utf-8";

:root { --woof-sd-ie-clr_width: 60px; --woof-sd-ie-clr_height: 60px; --woof-sd-ie-clr_show_tooltip: none; --woof-sd-ie-clr_show_tooltip_count: block-inline; --woof-sd-ie-clr_color: #000000; --woof-sd-ie-clr_image: url(); --woof-sd-ie-clr_hover_scale: 110; --woof-sd-ie-clr_selected_scale: 110; --woof-sd-ie-clr_border_radius: 50%; --woof-sd-ie-clr_border_width: 1px; --woof-sd-ie-clr_hover_border_width: 1px; --woof-sd-ie-clr_selected_border_width: 1px; --woof-sd-ie-clr_border_color: #79b8ff; --woof-sd-ie-clr_hover_border_color: #79b8ff; --woof-sd-ie-clr_selected_border_color: #79b8ff; --woof-sd-ie-clr_border_style: solid; --woof-sd-ie-clr_hover_border_style: dashed; --woof-sd-ie-clr_selected_border_style: dashed; --woof-sd-ie-clr_margin_right: 9px; --woof-sd-ie-clr_margin_bottom: 11px; --woof-sd-ie-clr_transition: 300s; --woof-sd-ie-clr_counter_show: inline-flex; --woof-sd-ie-clr_counter_width: 14px; --woof-sd-ie-clr_counter_height: 14px; --woof-sd-ie-clr_counter_side_padding: 0; --woof-sd-ie-clr_counter_top: 4px; --woof-sd-ie-clr_counter_right: 0; --woof-sd-ie-clr_counter_font_size: 9px; --woof-sd-ie-clr_counter_font_family: consolas; --woof-sd-ie-clr_counter_font_weight: 500; --woof-sd-ie-clr_counter_color: #477bff; --woof-sd-ie-clr_counter_bg_color: #ffffff; --woof-sd-ie-clr_counter_bg_image: url(); --woof-sd-ie-clr_counter_border_width: 1px; --woof-sd-ie-clr_counter_border_radius: 50%; --woof-sd-ie-clr_counter_border_color: #477bff; --woof-sd-ie-clr_counter_border_style: solid; }

.woof-sd-ie.woof-sd-ie-color { position: relative; display: inline-flex; box-sizing: border-box; margin-right: var(--woof-sd-ie-clr_margin_right) !important; margin-bottom: var(--woof-sd-ie-clr_margin_bottom) !important; }

.woof-sd-ie.woof-sd-ie-color > input { display: none; }

.woof-sd-ie.woof-sd-ie-color > label { position: relative; transition: all calc(var(--woof-sd-ie-clr_transition)/1000); border-radius: var(--woof-sd-ie-clr_border_radius); background-color: var(--woof-sd-ie-clr_color); background-image: var(--woof-sd-ie-clr_image); background-size: cover; width: 100%; display: flex !important; flex-direction: row !important; line-height: 0 !important; box-sizing: border-box !important; user-select: none !important; min-width: var(--woof-sd-ie-clr_width) !important; height: var(--woof-sd-ie-clr_height) !important; margin: 0px !important; border-color: var(--woof-sd-ie-clr_border_color) !important; border-style: var(--woof-sd-ie-clr_border_style) !important; border-width: var(--woof-sd-ie-clr_border_width) !important; max-width: var(--woof-sd-ie-clr_width) !important; }

.woof-sd-ie.woof-sd-ie-color:hover > label { scale: calc(var(--woof-sd-ie-clr_hover_scale)/100); border-color: var(--woof-sd-ie-clr_hover_border_color) !important; border-style: var(--woof-sd-ie-clr_hover_border_style) !important; border-width: var(--woof-sd-ie-clr_hover_border_width) !important; }

.woof-sd-ie.woof-sd-ie-color:has(input:checked) > label { border-color: var(--woof-sd-ie-clr_selected_border_color) !important; border-style: var(--woof-sd-ie-clr_selected_border_style) !important; border-width: var(--woof-sd-ie-clr_selected_border_width) !important; scale: calc(var(--woof-sd-ie-clr_selected_scale)/100) !important; }

.woof-sd-ie.woof-sd-ie-color > label:hover > span { zoom: 1; letter-spacing: normal; word-spacing: normal; transition: all calc(var(--woof-sd-ie-clr_transition)/1000); border-color: var(--woof-sd-ie-clr_hover_color) !important; }

.woof-sd-ie.woof-sd-ie-color .woof-sd-ie-count { user-select: none; display: var(--woof-sd-ie-clr_counter_show); flex-direction: row; justify-content: center; align-items: center; position: absolute; right: var(--woof-sd-ie-clr_counter_right); top: var(--woof-sd-ie-clr_counter_top); border: var(--woof-sd-ie-clr_counter_border_width) var(--woof-sd-ie-clr_counter_border_style) var(--woof-sd-ie-clr_counter_border_color); border-radius: var(--woof-sd-ie-clr_counter_border_radius); min-width: var(--woof-sd-ie-clr_counter_width); min-height: var(--woof-sd-ie-clr_counter_height); padding-left: var(--woof-sd-ie-clr_counter_side_padding); padding-right: var(--woof-sd-ie-clr_counter_side_padding); font-size: var(--woof-sd-ie-clr_counter_font_size); font-weight: var(--woof-sd-ie-clr_counter_font_weight); font-family: var(--woof-sd-ie-clr_counter_font_family); color: var(--woof-sd-ie-clr_counter_color); line-height: 0; background-color: var(--woof-sd-ie-clr_counter_bg_color); background-image: var(--woof-sd-ie-clr_counter_bg_image); background-size: cover; box-sizing: content-box; z-index: 99; }

.woof-sd-ie.woof-sd-ie-color .woof-sd-ie-count:empty { display: none; }

.woof-sd-ie.woof-sd-ie-color:hover > label { cursor: pointer; }

.woof-sd-ie.woof-sd-ie-color > label > span { position: relative; box-sizing: border-box; display: flex; flex: 0 0 100%; justify-content: center; flex-direction: column; width: 100%; height: 100%; }

.woof-sd-ie.woof-sd-ie-color > label > span { border-radius: var(--woof-sd-ie-clr_border_radius); }

.woof-sd-ie.woof-sd-ie-color .woof-sd-tooltiptext { display: var(--woof-sd-ie-clr_show_tooltip); }

.woof-sd-ie.woof-sd-ie-color .woof-sd-tooltiptext b { display: var(--woof-sd-ie-clr_show_tooltip_count); }