{"version":3,"file":"common/css/image-picker.css","mappings":";;;AAAA;EACE;EACA;EACA;EACA;AACF;AACE;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AACJ;AACI;EACE;EACA;AACN;AAEI;EACE;AAAN;AAGI;EAEE;EACA;AAFN;AAKI;EAEE;AAJN;AAOI;;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AALN;AAOM;;EACE;AAJR;AAQI;EACE;EACA;EACA;EACA;EACA;EACA;AANN;AASI;EACE;EACA;EACA;EACA;EACA;EACA;EACA;AAPN;AAWE;EACE;EACA;EACA;EACA;EACA;AATJ;;AAaA;EACI;EACA;AAVJ,C","sources":["webpack://@codecanel/before-after-image-slider/./src/common/styles/image-picker.scss"],"sourcesContent":[".coca-image-picker {\n  position: relative;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 10px;\n\n  .picker-item {\n    width: 100px;\n    height: 100px;\n    max-width: 100px !important;\n    position: relative;\n    display: inline-block;\n    margin-right: 0 !important;\n    line-height: 0;\n    cursor: pointer;\n    border: 2px solid #eee;\n    border-radius: 6px;\n    transition: 300ms ease-in-out;\n\n    &.active {\n      border: 2px solid #4a25e1;\n      box-shadow: 0 0 4px 0 #4a25e1;\n    }\n\n    &:hover:not(.active) {\n      box-shadow: 0 0 10px 0 #eee;\n    }\n\n    &:hover input,\n    &.active input {\n      outline: 2px solid transparent;\n      box-shadow: 0 0 0 1px #4a25e1;\n    }\n\n    &:not(.active) input[type=\"button\"],\n    &:not(.active) input[type=\"checkbox\"] {\n      opacity: 0;\n    }\n\n    input[type=\"checkbox\"],\n    input[type=\"button\"] {\n      position: absolute;\n      z-index: 10;\n      margin: 0;\n      border: none;\n      border-radius: unset;\n      transition: 300ms ease-in-out;\n      width: 100px;\n      height: 100px;\n\n      &[value] {\n        display: none;\n      }\n    }\n\n    img {\n      position: absolute;\n      width: 100px;\n      height: 100px;\n      top: 0;\n      left: 0;\n      border-radius: 4px;\n    }\n\n    .picker-item__premium {\n      position: absolute;\n      top: 50%;\n      right: 50%;\n      height: 28px;\n      width: 28px;\n      z-index: 20;\n      transform: translateX(130%) translateY(-50%);\n    }\n  }\n\n  .picker-item__label {\n    color: #475467;\n    font-size: 12px;\n    font-weight: 500;\n    text-align: center;\n    margin: 10px 0 0 0;\n  }\n}\n\n.elementor-control-content .picker-item {\n    width: 44px;\n    height: 44px;\n}"],"names":[],"sourceRoot":""}