// /**
//  * DISCLAIMER
//  *
//  * Do not edit or add to this file if you wish to upgrade Smile ElasticSuite to newer
//  * versions in the future.
//  *
//  *
//  * @category  Smile
//  * @package   Smile\ElasticsuiteCatalog
//  * @author    Aurelien FOUCRET <aurelien.foucret@smile.fr>
//  * @copyright 2020 Smile
//  * @license   Open Software License ("OSL") v. 3.0
//  */


div.admin__fieldset.elasticsuite-optimizer-preview {
    float:left;
    padding-bottom:0;
    padding-top:0;
}

div.optimizer-preview-fieldset {
    margin-left: 4rem;
    .category {
        float:left;
        margin-bottom: 0;
        margin-top: 0;
        min-width: 450px;
        .admin__field-label {
            width: auto;
        }
        ._unclickable {
            .admin__action-multiselect-label {
                cursor: default;
                font-weight: normal;
                color: #aaa;
            }
        }
    }

    .query-text {
        float:left;
        margin-bottom: 0;
        margin-top: 0;
        min-width: 450px;
        .admin__field-label {
            width: auto;
        }
    }

    .search-container {
        float:left;
        .admin__field-label {
            width: auto;
        }
    }

    fieldset {
        margin-left: 50px;
    }
}

.elasticsuite-optimizer-preview {

    .preview-button-container {
        width: 40%;
        text-align: center;
    }

    .bottom-links {
        clear: both;
    }

    .compare {
        display: inline-block;
        clear: both;
        width: 100%;
    }

    .product-list-container {
        width: 48%;
        float:left;
        margin-bottom: 20px;

        .product-list-title {
            text-align:center;
            h1 {
                font-size: 2rem;
            }
        }
    }

    .bottom-links {
        width: 40%;
        margin: 10px auto;
        border: 1px solid #cccccc;
        text-align: center;
        a.show-more-link {
            padding: 15px 10px;
            width: 100%;
            display: block;
        }
    }

    .admin__data-grid-loading-mask {
        position: fixed;
    }

    .product-list {
        width: 100%;
        margin: 0 40px 0;
        border-width: 1px 0 0 0;
        border-color: #dadfe0;
        border-style: solid;

        li.product-list-item, li.product-list-item-placeholder {
            width: 100%;
            overflow: hidden;
            position: relative;
            border-width: 0 1px 1px 1px;
            border-color: #dadfe0;
            border-style: solid;
            padding: 10px;
            vertical-align: top;
            list-style-type: none;
            display:inline-block;

            h1 {
                margin: 0px 0 2px;
                font-size: 1em;
                font-weight:bold;
                margin-bottom: 5px;
                span {
                    width: 80%;
                }
            }

            div.product-details {
                display: inline-block;
                p {
                    margin: 0 0 0em;
                }
            }

            div.product-image {
                text-align: left;
                width: 80px;
                height: 80px;
                margin-right: 10px;
                float: left;

                img {
                    max-width: 80px;
                    max-height: 80px;
                }
            }

            .score-container {
                position: absolute;
                right: -15px;
                margin-top: -60px;
                width: 140px;

                .effect {
                    display: block;
                    height: 20px;
                    width: 20px;
                    font-size: 300%;
                    margin-bottom: 35px;
                    margin-left:70px;
                    margin-top: -10px;

                    &.up:after {
                        color: rgb(63, 190, 57);
                        content: "↗";
                    }

                    &.down:after {
                        color: rgb(255, 0, 0);
                        content: "↘";
                    }
                }

                .effect:after {
                    color: rgb(0, 0, 0);
                    content: "→";
                }
            }
        }
    }
}

div.fieldset-wrapper[data-index="attribute_value"] {
    .action-select-wrap {
        width: calc(100% - 45px - 4px);
        float:left;
    }
}

.a-right {
    text-align: right;
}

.slider-field {
    .admin__field-control._with-tooltip, .admin__field-control {
        input.admin__control-text, admin__field-error {
            width: 20%;
        }
    }
    .admin__field-error {
        margin-left: 40%;
        width: 20%;
    }
}

.smile-es-slider {
    width: 40%;
    margin-top: -1rem;
    padding-right: 2rem;
    float: left;
    [data-role=from-label] {
        display: block;
        float: left;
        padding: 0 0 @indent__xs;
    }

    [data-role=to-label] {
        display: block;
        float: right;
        padding: 0 0 @indent__xs;
    }
    [data-role=warning-slider] {
        margin-left: 0.5rem;
        &:before {
            font-family: 'Admin Icons';
            content: '\e623';
        }
    }

    .ui-slider {
        margin: @indent__xs;
        clear: both;
    }

    .ui-slider-handle {
        .lib-css(background, @active__color);
        padding: 0;
        margin: -3px 0 0 -7px;
        border-radius: 15px;
        width: 15px;
        height: 15px;
    }
}


.admin__fieldset {
    fieldset.optimizer-radioset-tooltip {
        margin-bottom: 0;
    }

    > .admin__field {
        > .admin__field-control.optimizer-chart {
            .chart-range {
                width: 25%;
                display: inline-block;
                vertical-align: top;
                padding: 2rem 3rem;
                [data-role=range] {
                    display: block;
                    cursor: pointer;
                    color: #ffffff;
                    margin-top: 1rem;
                    width: 7em;
                }
            }
            .chart-canvas {
                width: 70%;
                display: inline-block;
                float: left;
            }
        }
    }
}

code.literal {
    font-family: Consolas,Menlo,DejaVu Sans Mono,Bitstream Vera Sans Mono,Lucida Console,monospace;
    padding: 0 3px;
    font-weight: 600;
    font-size: .9em;
    display: inline;
    white-space: pre-wrap;
    background: #e9e9e9;
    color: #555;
}
