@import "variables";
@import "mixins";
@import "panel"; 

$button-size: 70px;

.panel {
    padding-left: 0px;
    // padding-right: 0px;
    background-position: 0 100%;

    &__content {
        padding-left: 5px;
    }
}

.form-with-button {
    width: calc(100% - #{$button-size});
    float: left;

    &:focus {
        box-shadow: none;
    }

    font-size: $default-font-size;
    height: 29px;
    padding: 0 5px 0 5px;    

    background-color: $status-editor-title-background;
    color: $status-editor-color;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    border-width: 0;
    margin-bottom: 0;

    // background-color: $column-color;
    // border-color: $button-border-color;
    // color: #fff;
    // font-size: $default-font-size;
    // &:focus {
    //     box-shadow: none;
    // }
    // height: 29px;
    // padding: 0 5px 0 5px; 
}

.waiting-icon {
    position: relative;
    top:1px;
    left: 3px;
}

.form-button {
    @include clearButton;
    transition: all .2s;
    background-color: $status-editor-footer-background;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;

    &:hover {
        background-color: lighten($status-editor-footer-background, 20%);
        background-color: darken($status-editor-footer-background, 20%);
    }

    outline: inherit;
    &:focus {
        background-color: darken($status-editor-footer-background, 20%);
    }

    width: $button-size;
    height: 29px;
}

$comrade_yellow: #ffcc00;
$comrade_red:  #a50000;
.comrade {
    &__title {
        font-size: 18px;
        margin-left: 5px;
        color: $comrade_yellow;
        font-weight: bold;
    }

    &__text {
        color: $comrade_yellow;
    }

    &__button {
        background: $comrade_yellow;
        border-color: $comrade_yellow;
        color: $comrade_red;
    }

    &__video {
        width: 300px;  
        padding-top: 20px;
        margin: auto;
    }

    &__input {
        color: $comrade_red;
        border-color: $comrade_yellow;
        background: $comrade_yellow;
    }

    &__background {
        transition: all 3s;
        background-image: url("assets/img/juche-background.jpg");        
        background-color: $comrade_red;
        background-position: 0 0;
    }
}