.color-info-container{box-shadow:var(--box-shadow-default);border-radius:12px;background-color:#fff;padding:12px;width:400px}.color-code-box,.color-preview{border-radius:6px;height:50px}.color-preview{cursor:pointer;background-color:red}.color-code-box{display:flex;justify-content:space-between;align-items:center;margin-top:12px;box-shadow:var(--box-shadow-default);overflow:hidden;font-size:1.3rem}.color-code-type{border-right:1px solid #e9e9e9;width:50px;height:100%;color:#222;font-weight:600;line-height:50px;text-align:center}.color-code-copy-btn{cursor:pointer;border:none;background-color:#000;width:50px;height:100%}.color-code-copy-btn:hover{background-color:#312f2f}.color-code-copy-btn img{filter:invert(100%);width:20px}.float-color-picker-container{display:none;position:absolute;z-index:1;box-shadow:var(--box-shadow-default);border-radius:6px;background:#fff;padding:8px;touch-action:none;user-select:none}.float-color-picker-close-btn{display:flex;position:absolute;top:-12px;right:-12px;justify-content:center;cursor:pointer;box-shadow:var(--box-shadow-default);border:none;border-radius:50%;background:#fff;width:25px;height:25px;font-weight:700;font-size:2.3rem;line-height:1}.float-color-picker-close-btn:hover{color:red}.float-color-picker-color-preview{margin-bottom:8px;box-shadow:var(--box-shadow-default);border-radius:4px;background:red;height:20px}.float-color-picker{position:relative;margin-bottom:10px;box-shadow:var(--box-shadow-default);background:red;width:200px;height:200px}.float-color-picker-black-bg{position:absolute;background:linear-gradient(to top,#000,rgba(0,0,0,0));width:100%;height:100%}.float-color-picker-white-bg{background:linear-gradient(to right,#fff,rgba(255,255,255,0));width:100%;height:100%}.float-color-picker-thumb{position:absolute;top:-10px;left:190px;z-index:1;cursor:pointer;border:2px solid #fff;border-radius:100%;background:red;width:16px;height:16px}.float-color-picker-hue-selector{position:relative;height:25px}.float-color-picker-hue-selector-range{-webkit-appearance:none;appearance:none;outline:0;border-radius:4px;background-image:url(/assets/images/backgrounds/hue-image.png);background-size:cover;width:200px;height:25px}.float-color-picker-hue-selector-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;margin-top:-1px;border:1px solid #ccc;border-radius:3px;background-color:#fff;width:10px;height:27px}.float-color-picker-hue-selector-range::-moz-range-thumb{border:1px solid #ccc;border-radius:3px;background-color:#fff;width:6px;height:25px}.float-color-picker-color-select-btn{cursor:pointer;margin-top:10px;border:none;border-radius:4px;background:#4f87ff;width:100%;height:35px;color:#fff;font-weight:600;letter-spacing:1px}.float-color-picker-color-select-btn:hover{background:#457bf0}