/* compileExpanded: ../css/$1.css*/

@import 'vendor/bourbon/bourbon';
@import 'variables';

#risen {
    &_page_options,
    &_page_options,
    &_post_options,
    &_portfolio_options,
    &_woocommerce_options {
        .inside {
            margin: 0;
            padding: 0;
        }
    }
}

.risen_metabox_wrapper {
	background: #f5f5f5;
}
.risen_metabox_tabs {
    float: left;

    box-sizing: border-box;
    width: 17%;
    margin: 0;
    padding: 0;

    .rtl & {
        float: right;
    }

    li {
        margin: 0;
        padding: 0;

        a {
            font-size: 13px;

            display: block;

            padding: 13px;

            text-decoration: none;
            word-wrap: break-word;

            color: #222;
            border-right: 1px solid #e2dddb;
            border-bottom: 1px solid #e2dddb;
            box-shadow: none;

            &:before {
                font-family: dashicons;
                font-size: 20px;

                position: relative;
                top: 5px;

                margin-right: 10px;

                content: '\f347';

                color: #777;

                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                speak: none;
            }
        }

        &.active a,
        a:hover {
            border-right-color: transparent;
            background-color: #fff;
        }
    }

    /* Icons*/
    a[href^='sliders']:before {
        content: '\f134';
    }

    a[href^='page']:before {
        content: '\f105';
    }

    a[href^='header']:before {
        content: '\f535';
    }

    a[href^='footer']:before {
        content: '\f209';
    }

    a[href^='sidebar']:before {
        content: '\f489';
    }

    a[href^='background']:before {
        content: '\f128';
    }

    a[href^='portfolio']:before {
        content: '\f233';
    }

    a[href^='pagetitlebar']:before {
        content: '\f116';
    }

    a[href^='post']:before,
    a[href^='faq_page']:before {
        content: '\f123';
    }
}

.risen_metabox {
    float: left;
	background: #fff;

    box-sizing: border-box;
	min-height: 450px;
    width: 83%;
    padding: 30px;
    padding-bottom: 10px;

    .rtl & {
        float: right;
    }
}
.risen_metabox_tab {
    display: none;

    &.active {
        display: block;
    }
}

.risen_metabox_field {
    overflow: hidden;

    padding-top: 14px;
    padding-bottom: 14px;

    border-bottom: 1px solid #fafafa;

    @at-root .risen_metabox_tab &:first-child {
        padding-top: 0;
    }
}

#poststuff .risen_metabox h3 {
    font-size: 17px !important;

    margin: 10px 0 5px 0;
    padding-left: 0 !important;

    color: #b5b4b4;
}

.risen_desc {
    float: left;

    width: 44.5%;

    label {
        font-size: 13px;

        color: #222;
    }

    p {
        font-size: 12px;

        margin: 0;
        margin-top: 8px;

        color: #939393;
    }
}

.risen_field {
    position: relative;

    float: right;

    width: 51%;
    margin-right: 1px;

    input[type=text],
    select {
        font-size: 13px;
        line-height: 32px;

        box-sizing: border-box;
        width: 100%;
        height: 34px;
        margin: 0;
        padding-left: .75em;

        color: #333;
        border: 1px solid rgba(0,0,0,.05) !important;
        background: rgb(244, 242, 242) !important;
        box-shadow: none !important;
    }
}

/* Select Field Styling*/
.risen_field {
    .select2-container {
        &,
        * {
            &:focus {
                outline: 0;
            }
        }

        .select2-selection {
            height: 34px;
            padding-left: .75em;

            border-color: rgba(0, 0, 0, .05) !important;
            border-radius: 0 !important;
            background-color: rgb(244, 242, 242);
            box-shadow: none !important;

            > .select2-selection__rendered {
                line-height: 32px;
            }

            .select2-selection__arrow {
                width: 31px;
                height: 32px;

                -webkit-transition: all 200ms ease-in-out;
                        transition: all 200ms ease-in-out;

                border-left: 1px solid rgba(0, 0, 0, .05);
                background: #f4f2f2;
                box-shadow: none !important;

                b {
                    margin: 0;

                    -webkit-transform: translate( -50%, -50% );
                            transform: translate( -50%, -50% );

                    border: 0;

                    @include size(auto);

                    &:after {
                        font-family: dashicons;
                        font-size: 12px;

                        content: '\f347';

                        color: #777;
                    }
                }
            }
        }
    }
}

.select2-dropdown.risen-select2 {
    border-color: rgba(0, 0, 0, .05);
    border-radius: 0;
    background: #f4f2f2;

    .select2-results__options {
        li:last-child {
            margin-bottom: 0;
        }
    }

    .select2-results .select2-results__option {
        line-height: 29px;

        overflow: hidden;

        height: 32px;
        padding: 0 .75em;
    }
}

/* Button set styling*/
.risen_field.risen-buttonset {
    overflow: hidden;

    a {
        font-size: 14px;

        float: left;
		color: #333;

        min-width: 60px;
        max-width: 300px;
        padding: 6px 14px;

        -webkit-transition: all .1s ease-in-out;
                transition: all .1s ease-in-out;
        text-align: center;
        text-decoration: none;

        border: 1px solid #ccc;
        background-color: #f5f5f5;
        box-shadow: inset 0 -1px 0 rgba( #000,.1 );

        &:first-of-type {
            border-right: 0;
            border-radius: 4px 0 0 4px;
        }

        &:last-of-type {
            border-left: 0;
            border-radius: 0 4px 4px 0;
        }
    }

    .buttonset-state-active {
        color: #fff;
        border-color: rgba(0, 0, 0, .1) !important;
        background-color: #00a0d2;
    }
}

.risen_upload {
    overflow: hidden;

    padding-bottom: 5px;

    input.upload_field {
        float: left;

        width: calc( 100% - 100px );
    }

    .risen_upload_button {
        float: left;

        width: 90px;
        height: 34px;
        margin: 0 0 0 5px;

        color: #333;
        border: 1px solid #c7c5c5;
        border-radius: 0;
        background: none repeat scroll 0 0 #fff;
        box-shadow: none;
    }
}

// Dimension Field Styling
.risen-dimension {
	margin-right: 10px;
	margin-bottom: 7px;
	font-size: 0;
	white-space: nowrap;
	display: inline-block;
	margin-bottom: 6px;
	overflow: hidden;

	.add-on {
		border: 1px solid rgba(0, 0, 0, 0.1) !important;
		border-right: none !important;
		height: 34px;
		width: 34px;
		font-size: 12px;
		background-color: #fff;
		box-sizing: border-box;
		color: rgba(0, 0, 0, 0.5);
		border: none;
		padding: 0;
		font-weight: 400;
		line-height: 32px;
		text-align: center;
		text-shadow: 0 1px 0 #ffffff;
		display: block;
		float: left;
		min-width: 16px;

		i {
			font-size: 13px;
			text-rendering: auto;
			-webkit-font-smoothing: antialiased;
			height: 32px;
			line-height: 32px;
		}
	}

	input[type="text"] {
		width: 68px;
		padding: 0px 0.75em;
		float: left;
		margin: 0;
		text-align: center;
	}
}

.risen_field textarea {
	background: rgb(244, 242, 242) !important;
	border: 1px solid rgba(0,0,0,0.05) !important;
	box-shadow: none !important;
	margin: 0;
}

#risen_tab_pagetitlebar #risen_page_title_custom_text,
#risen_tab_pagetitlebar #risen_page_title_custom_subheader {
  padding: 7px 15px;
  resize: none;
}
