/**
 *
 * -----------------------------------------------------------
 *
 * Codestar Framework
 * A Lightweight and easy-to-use WordPress Options Framework
 *
 * Copyright 2015 Codestar <info@codestarlive.com>
 *
 * -----------------------------------------------------------
 *
 */
@import "compass";
@import "vendor/mixins";

//
// Prefix
//
.csf{
  margin-left: 20px;
  margin-right: 0;
}

//
// Header
//
.csf-header{
  h1{
    float: right;
  }

  fieldset{
    float: left;
  }
}

//
// Header and Footer Buttons
//
.csf-buttons{
  float: left;
}

//
// Header Helpers
//
.csf-header-left{
  float: right;
}

.csf-header-right{
  float: left;
}

//
// Navigation
//
.csf-nav{
  float: right;

  ul{
    clear: right;

    li{
      .csf-section-active:after{
        right: auto;
        left: 0;
        border-left-color: #fff;
        border-right-color: transparent;
      }

      .csf-arrow:after{
        content: "\f053";
        right: auto;
        left: 10px;
      }

      &.csf-tab-active .csf-arrow:after{
        @include transform( rotate(-90deg) );
      }
    }

    ul{
      li{
        a{
          padding-right: 25px;
          padding-left: 15px;
        }
      }

      &:before{
        left: auto;
        right: 15px;
      }
    }
  }

  .fa{
    margin-left: 5px;
    margin-right: 0;
  }
}

//
// Navigation Background
//
.csf-nav-background{
  left: auto;
  right: 0;
}

//
// Content
//
.csf-content{
  margin-left: 0;
  margin-right: 225px;
}

//
// Sections
//
.csf-sections{
  float: right;
}

//
// Show all options
//
.csf-show-all .csf-content {
  margin-right: 0;
  overflow: hidden;
}

.csf-expand-all {
  right: auto;
  left: 40px;
}

//
// Search
//
.csf-search{

  input{
    margin: 0 10px 0 0;
  }
}

//
// Copyright
//
.csf-copyright{
  float: right;
}

//
// Metabox
//
.csf-metabox{
  margin: -6px -12px -12px -12px;

  .csf-section-title{
    padding: 20px;
  }
}

//
// Field
//
.csf-field{

  .csf-title{
    float: right;
  }

  .csf-fieldset{
    margin-left: 0;
    margin-right: 30%;
  }
}

//
// Field Pseudo
//
.csf-pseudo-field{
  padding: 0 0 0 5px !important;
}

//
// Field: Number
//
.csf-field-number{

  em{
    margin-left: 0;
    margin-right: 5px;
  }
}

//
// Field: Typography
//
.csf-field-typography{

  select,
  .chosen-container{
    margin-right: 0;
    margin-left: 5px;
  }
}

//
// Field: Checkbox and Radio
//
.csf-field-checkbox,
.csf-field-radio{

  .horizontal li{
    margin-right: 0;
    margin-left: 15px;
  }
}

//
// Field: Switcher
//
.csf-field-switcher{

  label{
    float: right;
  }

  .csf-text-desc{
    float: right;
    margin-left: 0;
    margin-right: 5px;
  }
}

//
// Field: Upload
//
.csf-field-upload{
  .csf-button{
    margin-left: 0;
    margin-right: 10px;
  }
}

//
// Field: Color Picker
//
.csf-field-color_picker{

  .csf-alpha-slider{
    margin-left: 0;
    margin-right: 2px;

    .ui-slider-handle{
      margin: 0 -11px;
    }
  }

  .csf-alpha-slider-offset{
    background-position: center right;
  }

  .csf-alpha-text{
    right: auto;
    left: 10px;
  }
}

//
// Field: Group
//
.csf-field-group{

  .csf-cloneable-title{
    padding: 15px 10px 15px 65px;
  }

  .csf-cloneable-helper{
    right: auto;
    left: 10px;
  }
}

//
// Field: Repeater
//
.csf-field-repeater{

  .csf-cloneable-helper{
    border-left: 0;
    border-right: 1px solid #eee;
  }
}

//
// Field: Help
//
.csf-help{
  right: auto;
  left: 5px;
}

//
// Field: Icon
//
.csf-field-icon{

  .button{
    margin-right: 0;
    margin-left: 5px;
  }

  .csf-icon-preview i{
    margin-right: 0;
    margin-left: 5px;
  }
}

//
// Field: Gallery
//
.csf-field-gallery{

  ul li{
    margin-right: 0;
    margin-left: 5px;
  }

  .button{
    margin-right: 0;
    margin-left: 5px;
  }
}

//
// Field: Sorter
//
.csf-field-sorter{

  .csf-modules{
    float: right;
  }

  .csf-disabled{
    margin-left: 0;
    margin-right: 15px;
  }
}

//
// Field: Tabbed
//
.csf-field-tabbed{

  .csf-tabbed-nav{

    .fa{
      padding-right: 0;
      padding-left: 5px;
    }

    a{
      margin-right: 0;
      margin-left: 5px;
    }
  }
}

//
// Taxonomy UI
//
.csf-taxonomy-add-fields{

  .csf-fieldset{
    margin-right: 0;
  }

  .csf-field > .csf-fieldset > .csf-help{
    left: -5px;
    right: auto;
  }
}

.csf-taxonomy-edit-fields{

  .csf-fieldset{
    margin-left: 0;
    margin-right: 225px;
  }

  .csf-field > .csf-fieldset > .csf-help{
    right: auto;
    left: -5px;
  }
}

//
// Modal UI
//
.csf-modal-content{

  .csf-field{
    padding: 15px 15px 15px 30px;
  }
}

.csf-modal-title{
  padding: 0 16px 0 36px;
}

.csf-modal-close{
  right: auto;
  left: 0;
}

//
// Responsive Utilities
//
@media only screen and (max-width:1200px){
  .csf-metabox .csf-field .csf-fieldset{
    margin-left: 0;
  }
}

@media only screen and (max-width:782px){
  .csf .csf-fieldset,
  .csf .csf-content{
    margin-right: 0;
  }
}