//
// Common control styles
// --------------------------------------------------

//
// The scroll panel can host a scrollbar control. It has a right border that covers 
// the scrollbar to satisfy the design requirements.
//
.control-scrollpanel {
    position: relative;
    background: @color-panel-light;

    .control-scrollbar {
        &.vertical > .scrollbar-scrollbar {right: 0;}
    }
}

.tooltip {
    .tooltip-inner {
        text-align: left;
        padding: 5px 8px;
    }

    &.in {
        .opacity(1);
    }
}

.oc-bg-logo {
    background-image: url(../images/october-logo-transparent.svg);
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: 50% auto;
}

//
// Callouts
// --------------------------------------------------

.callout {
    margin-bottom: @line-height-computed;
    padding: @callout-padding;
    border-left: 3px solid @callout-border;
    code, .highlight {
    }
    h4 {
        margin-top: 0;
        margin-bottom: 5px;
    }
    p:last-child {
        margin-bottom: 0;
    }
}

.callout-danger {
    background-color: @callout-danger-bg;
    border-color: @callout-danger-border;
    h4 {
        color: @callout-danger-text;
    }
}

.callout-warning {
    background-color: @callout-warning-bg;
    border-color: @callout-warning-border;
    h4 {
        color: @callout-warning-text;
    }
}

.callout-info {
    background-color: @callout-info-bg;
    border-color: @callout-info-border;
    h4 {
        color: @callout-info-text;
    }
}

.callout-success {
    background-color: @callout-success-bg;
    border-color: @callout-success-border;
    h4 {
        color: @callout-success-text;
    }
}