@o-we-font-family: Roboto, 'Montserrat', "Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;

@o-we-color-dark: #2c2c36;
@o-we-color-darker: darken(@o-we-color-dark, 2%);
@o-we-color-divider: #33363e;
@o-we-color-light: #4e525b;
@o-we-color-normal: #50545d;
@o-we-color-paper: #fbfbfd;
@o-we-color-text-normal: #999999;
@o-we-color-text-light: #d4d5d7;
@o-we-color-danger: #e6586c;
@o-we-color-warning: #f0ad4e;
@o-we-color-success: #40ad67;
@o-we-color-info: #6999a8;

@o-we-sidebar-width: 210px;

@o-we-tab-active-bg: #3D4048;

// Transitions
@o-we-md-ease: cubic-bezier(0.19, 1, 0.22, 1);

// Animations
@-webkit-keyframes fadeInDownSmall {
    0% {
        opacity: 0;
        .translate(0, -5px);
    }
    100% {
        opacity: 1;
        .translate(0, 0);
    }
}
@keyframes fadeInDownSmall {
    0% {
        opacity: 0;
        .translate(0, -5px);
    }
    100% {
        opacity: 1;
        .translate(0, 0);
    }
}

@-webkit-keyframes fadeInOut {
    0% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    75% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes fadeInOut {
    0% {
        opacity: 0;
    }
    25% {
        opacity: 1;
    }
    75% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes inputHighlighter {
    from { background: @odoo-brand-optional; }
    to   { width: 0; background: transparent; }
}
@keyframes inputHighlighter {
    from { background: @odoo-brand-optional; }
    to   { width: 0; background: transparent; }
}


// ============    Preservetion mixins    ===============
// Used to preserve web_editor and website UI from themes customizations

.o-w-preserve-base() {
    font-family: @o-we-font-family;
    line-height: 1.42857143;
    color: @o-we-color-divider;

    .text-muted {
        color: @o-we-color-text-normal;
    }
}

.o-w-preserve-headings() {
    h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
        font-family: @o-we-font-family;
        line-height: 1.42857143;
        color: @o-we-color-dark;
        font-weight: bold;
    }
}

.o-w-preserve-links() {
    a:not(.o_btn_preview) {
        color: @odoo-brand-optional;

        &:focus, &:active, &:focus:active {
            outline: none!important;
        }
    }
}

.o-w-preserve-forms() {
    .form-control {
        height: 34px;
        padding: 6px 12px;
        font-size: 14px;
        line-height: 1.42857143;
        border: 1px solid @o-we-color-text-light;
        color: #555;
        background-color: #fff;
        border-radius: 0;
    }
}

.o-w-preserve-modals() {
    background: 0;

    .modal-content {
        border-radius: 0;
        background-color: @o-we-color-paper;

        .modal-body {
            background-color: white;
        }
        .modal-footer {
            text-align: left;
        }
    }
}

.o-w-preserve-btn() {
    .btn:not(.o_btn_preview) {
        border-width: 1px;
        border-radius: 0;
        font-weight: normal;
        .button-size(6px; 12px; 14px; 1.42857143; 0);

        &.btn-primary {
            .button-variant(white, @odoo-brand-optional, darken(@odoo-brand-optional,5%));
            text-transform: uppercase;
        }
        &.btn-default {
            .button-variant(@odoo-brand-optional, white, @o-we-color-text-light);
            text-transform: uppercase;
        }
        &.btn-link {
            .button-variant(@odoo-brand-optional, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
        }
        &.btn-success {
            .button-variant(white; @o-we-color-success; darken(@o-we-color-success, 5%));
        }
        &.btn-info {
            .button-variant(white; @o-we-color-info; darken(@o-we-color-info, 5%));
        }
        &.btn-warning {
            .button-variant(white; @o-we-color-warning; darken(@o-we-color-warning, 5%));
        }
        &.btn-danger {
            .button-variant(white; @o-we-color-danger; darken(@o-we-color-danger, 5%));
        }

        &.btn-lg {
            .button-size(10px; 16px; 18px; 1.3333333; 0);
        }
        &.btn-sm {
            .button-size(5px; 10px; 12px; 1.5; 0);
        }
        &.btn-xs {
            .button-size(1px; 5px; 12px; 1.5; 0);
        }
    }
}

.o-w-preserve-wells() {
    .well {
        padding: 19px;
        margin-bottom: 20px;
        background-color: @o-we-color-paper;
        border: 1px solid darken(@o-we-color-paper,5%);
        border-radius: 0;
        .box-shadow(none);
    }
}