module.exports = ".mp-event-selector-wrapper {   display: -webkit-inline-box;   display: -ms-inline-flexbox;   display: inline-flex;   padding: 12px 26px 9px; /**     * Input animation     */ } .mp-event-selector-wrapper .selector-section {   -webkit-box-align: center;       -ms-flex-align: center;           align-items: center;   display: -webkit-box;   display: -ms-flexbox;   display: flex;   -ms-flex-wrap: wrap;       flex-wrap: wrap; } .mp-event-selector-wrapper .selector-section .event-clickable, .mp-event-selector-wrapper .selector-section .property-filter {   border-bottom: dotted 1px mp-control-label-text-color();   color: mp-control-label-text-color();   cursor: pointer;   display: inline-block;   height: 32px;   -webkit-box-pack: center;       -ms-flex-pack: center;           justify-content: center;   line-height: 20px;   margin: 0 6px 10px 0;   min-width: 12px;   padding: 6px 0 5px;   position: relative; } .mp-event-selector-wrapper .selector-section .event-clickable:hover, .mp-event-selector-wrapper .selector-section .property-filter:hover {   border-bottom-style: solid; } .mp-event-selector-wrapper .selector-section .event-clickable span:not(:first-child)::before, .mp-event-selector-wrapper .selector-section .property-filter span:not(:first-child)::before {   content: ' '; } .mp-event-selector-wrapper .selector-section .event-clickable span:last-child, .mp-event-selector-wrapper .selector-section .property-filter span:last-child {   padding-right: 4px; } .mp-event-selector-wrapper .selector-section .event-clickable span {   margin-right: 4px; } .mp-event-selector-wrapper .selector-section .event-builder-container, .mp-event-selector-wrapper .selector-section .property-filter-builder-container {   bottom: 0;   left: 0;   position: absolute; } .mp-event-selector-wrapper .selector-section .property-filter-separator-label {   -ms-flex-item-align: start;       align-self: flex-start;   line-height: 20px;   margin-right: 8px;   padding: 6px 0; } .mp-event-selector-wrapper .selector-section .property-filter-separator-label.where-label {   margin-left: 0; } .mp-event-selector-wrapper .selector-section .property-filter {   border-bottom-color: $grey-500;   display: -webkit-box;   display: -ms-flexbox;   display: flex;   height: 32px;   line-height: 20px;   margin-right: 6px;   position: relative; } .mp-event-selector-wrapper .selector-section .property-filter:hover {   border-bottom-color: mp-control-label-text-color(); } .mp-event-selector-wrapper .selector-section .property-filter:hover span.property-filter-label-part {   color: mp-control-label-text-color(); } .mp-event-selector-wrapper .selector-section .property-filter:hover .property-filter-remove {   opacity: 1; } .mp-event-selector-wrapper .selector-section .property-filter .property-filter-label-part {   color: $grey-500; } .mp-event-selector-wrapper .selector-section .property-filter .property-filter-label-part.highlight {   color: $grey-700; } .mp-event-selector-wrapper .selector-section .property-filter .property-filter-remove {   background: transparent;   border-width: 0;   opacity: 0;   padding: 0;   position: absolute;   right: -4px;   top: -8px; } .mp-event-selector-wrapper .property-filter-add-section {   -webkit-box-align: end;       -ms-flex-align: end;           align-items: flex-end;   -ms-flex-item-align: start;       align-self: flex-start;   display: -webkit-box;   display: -ms-flexbox;   display: flex;   margin-left: 8px;   position: relative; } .mp-event-selector-wrapper .property-filter-add-section .property-filter-search-icon-wrapper {   -webkit-box-align: center;       -ms-flex-align: center;           align-items: center;   bottom: 0;   display: -webkit-box;   display: -ms-flexbox;   display: flex;   height: 32px;   -webkit-box-pack: center;       -ms-flex-pack: center;           justify-content: center;   position: absolute; } .mp-event-selector-wrapper .property-filter-add-section input.property-filter-search-input {   border: 0;   border-bottom: 1px dotted mp-control-label-text-color();   border-radius: 0;   -webkit-box-shadow: none;           box-shadow: none;   height: 32px;   padding: 8px 0 8px 2px;   text-indent: 20px;   width: 160px; } .mp-event-selector-wrapper .property-filter-add-section input.property-filter-search-input.property-filter-search-active {   margin-right: 10px; } .mp-event-selector-wrapper .property-filter-add-section input.property-filter-search-input:focus {   border: 0;   border-bottom: 1px solid mp-control-label-text-color(); } .mp-event-selector-wrapper .selector-remove {   cursor: pointer;   height: 30px;   padding: 5px;   position: absolute;   right: 0;   top: 0; } .mp-event-selector-wrapper .property-filter-filter-button {   -webkit-transform: translate3d(-160px, 0, 0);           transform: translate3d(-160px, 0, 0);   -webkit-transition: -webkit-transform 0.25s $ease-out-quart;   transition: -webkit-transform 0.25s $ease-out-quart;   transition: transform 0.25s $ease-out-quart;   transition: transform 0.25s $ease-out-quart, -webkit-transform 0.25s $ease-out-quart; } .mp-event-selector-wrapper .property-filter-add-section:not(.property-filter-pane-open) .property-filter-search-input, .mp-event-selector-wrapper .property-filter-add-section:not(.property-filter-pane-open) .property-filter-search-icon-wrapper {   pointer-events: none;   visibility: hidden; } .mp-event-selector-wrapper .property-filter-add-section.property-filter-pane-open .property-filter-filter-button {   -webkit-transform: translate3d(0, 0, 0);           transform: translate3d(0, 0, 0); } .mp-custom-event-builder {   max-height: 400px;   min-height: 350px;   overflow-y: auto; } .mp-custom-event-builder .add-event-button-container {   -webkit-box-align: center;       -ms-flex-align: center;           align-items: center;   display: -webkit-box;   display: -ms-flexbox;   display: flex;   -webkit-box-flex: 1;       -ms-flex: 1;           flex: 1;   margin-top: 20px; } .mp-custom-event-builder .add-event-button-container .add-event-button {   background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, $grey-50), to($white));   background-image: linear-gradient(0deg, $grey-50 0, $white 100%);   border: 1px solid $grey-300;   border-radius: 50%;   -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2);           box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2);   cursor: pointer;   height: 28px;   margin-left: 2px;   padding: 0;   width: 28px; } .mp-custom-event-builder .add-event-button-container .add-event-button svg-icon {   margin: 2px; } .mp-custom-event-builder .add-event-button-container .add-event-button svg-icon svg {   -webkit-transform: rotateZ(-45deg);           transform: rotateZ(-45deg); } .mp-custom-event-builder .add-event-button-container .add-event-button:hover {   background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, $white), to($white));   background-image: linear-gradient(0deg, $white 0, $white 100%);   -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.23);           box-shadow: 0 1px 2px 0 rgba(0,0,0,0.23); } .mp-custom-event-builder .add-event-button-container .add-event-button:active {   border-color: $grey-200;   -webkit-box-shadow: 0 1px 0 0 $grey-150, inset 0 2px 3px 0 $grey-200;           box-shadow: 0 1px 0 0 $grey-150, inset 0 2px 3px 0 $grey-200; } .mp-custom-event-builder .add-event-button-container .add-event-button.add-event-button-container-disabled {   opacity: 0.6;   pointer-events: none; } .mp-custom-event-builder .event-selector-block {   margin: 10px 0; } .mp-custom-event-builder .event-selector-block:first-child {   margin-top: 0; } .mp-custom-event-builder .event-selector-block mp-custom-event-builder-event-selector {   background-color: $white;   border: 2px solid transparent;   border-radius: 6px;   -webkit-box-shadow: 0 1px 4px 0 rgba(0,0,0,0.1);           box-shadow: 0 1px 4px 0 rgba(0,0,0,0.1);   display: block;   position: relative; } .mp-custom-event-builder .event-selector-block mp-autoresizing-input, .mp-custom-event-builder .event-selector-block .autoresizing-input-input-container {   height: 24px;   margin-top: -3px; } .mp-custom-event-builder .event-selector-block mp-autoresizing-input input, .mp-custom-event-builder .event-selector-block .autoresizing-input-input-container input {   -webkit-box-align: center;       -ms-flex-align: center;           align-items: center;   border: 0;   border-radius: 0;   -webkit-box-shadow: none;           box-shadow: none;   color: $blue-500;   display: -webkit-box;   display: -ms-flexbox;   display: flex;   font-weight: $weight-medium;   height: 100%;   line-height: 28px;   margin-right: -1px;   padding: 0; } ";
