@charset "utf-8"
@import "common"

/* ---- Common---- {{{ */

.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12
    min-height: 24px

// }}}

/* ---- MOBILE PREVIEW ---- {{{ */

$mobile_preview_background: #000000
$mobile_preview_border: #1C1F1F
$icon_close: #E00101
.oe_mobile_preview
    &.modal .modal-content
        height: 660px
        background-color: $mobile_preview_background
        border: 2px solid $mobile_preview_border
        +border-radius(10px)
        margin: auto
        top: 0
        left: 0
        bottom: 0
        right: 0
        max-width: 330px
        .modal-header
            background-color: $mobile_preview_background
            border-bottom: 0
            +border-top-left-radius(10px)
            +border-top-right-radius(10px)
            .modal-title
                color: $mobile_preview_border
            .close
                color: lightgrey
                +opacity(1)
            .close:hover
                color: $icon_close
                +opacity(1)
        .modal-body
            background-color: $mobile_preview_background
            max-height: 600px
            padding: 0
            margin: 0
            .oe_mobile_viewport
                width: 320px
                height: 568px
                padding: 5px
                border: none
        .modal-footer
            background-color: $mobile_preview_background

// }}}

/* ---- SEO TOOLS ---- {{{ */

$remove_color: $icon_close
$in_title_color: #5cb85c
$in_description_color: #428bca
$in_body_color: #5bc0de
$highlighted_text_color: #ffffff
.oe_seo_configuration
    .modal-dialog
        width: 80%
    .oe_remove
        color: $remove_color
    .oe_seo_suggestion
        cursor: pointer
    .oe_seo_keyword
        padding: .2em .4em .2em .5em
        +border-radius(.4em)
    li.oe_seo_preview_g
        line-height: 1.2
        list-style: none
        list-style-image: none
        list-style-position: outside
        list-style-type: none
        font-size: small
        font-family: arial,sans-serif
        h3
            font-size: medium
        .r
            margin: 0
            font-size: 16px
            font-style: normal
            font-weight: normal
            overflow: hidden
            text-overflow: ellipsis
            -webkit-text-overflow: ellipsis
            white-space: nowrap
            a
                color: rgb(30, 15, 190)
                text-decoration: underline
                text-transform: none
                em
                    font-style: normal !important
        .s
            color: #444
            max-width: 42em
        .kv,.slp
            display: block
            margin-bottom: 1px
        .f
            color: #666
            margin-bottom: 1px
            cite
                color: #006621
                font-style: normal
                font-size: 14px
        .st
            line-height: 1.24


// }}}

/* ---- ACE EDITOR ---- {{{ */

$editorbar_height: 30px
$infobar_height: 20px
// TODO Fix => might break with themes

.oe_ace_view_editor
    position: fixed
    // top property is set programmatically
    right: 0
    z-index: 1001
    height: 100%
    background: #2F3129
    color: white
    .oe_ace_view_editor_title
        width: 100%
        padding-top: 0
        padding-left: 0
        height: $editorbar_height
        .oe_view_list
            width: 50%
            height: $editorbar_height
            @include editor-font
        .btn
            height: $editorbar_height
            padding: 0 4px 0 4px
            @include editor-font
    .ace_editor
        position: absolute
        top: $editorbar_height + $infobar_height
        right: 0
        // bottom property is set programmatically
        left: 0
        .ace_gutter
            cursor: ew-resize
    #ace-view-id
        padding: 0 1em
    &.oe_ace_open
        +opacity(0.97)
    &.oe_ace_closed
        z-index: -1000
        +opacity(0)

.oe_include_bundles
    font-weight: normal
    padding: 0 8px

// }}}

/* ---- CUSTOMIZE THEME ---- {{{ */
#theme_error
    background: #ffc
#theme_customize_modal
    overflow: auto
    z-index: 1020
    background: transparent
    display: block
    .modal-dialog
        top: 75px
        width: auto
        margin: 0
        position: absolute
        right: 10px
        font-family: 'Lato-Regular'
        font-weight: normal
        text-transform: capitalize
        letter-spacing: normal
    .modal-h5
        color: #ffffff
        font-family: 'Lato-Regular'
        font-weight: normal
        text-transform: uppercase
        letter-spacing: normal
        font-size: 14px
        color: white
        padding: 4px 0 4px 4px
        background-color: #bdc3c7
    table
        width: 100%
        margin-bottom: 8px
    label
        display: block
        text-align: center
        > div, > img
            border: 1px solid #fff
            line-height: 30px
            font-size: 0.9em
            margin: 2px 4px
        &.checked
            > div, > img
                box-shadow: 2px 2px 3px #888
                border: 1px solid #666
        img
            width: 60px
            height: 35px
            margin: 2px
            border: 1px solid rgba(136, 136, 136, 0.5)
        input
            display: none
    .loading_backdrop
        display: none
    &.loading
        .loading_backdrop
            display: block
            width: 100%
            height: 100%
            background: #000
            opacity: 0.3
            position: absolute
            z-index: 1