/*!
 * This file is part of the WPSF package.
 * This package is Open Source Software. For the full copyright and license
 * information, please view the LICENSE file which was distributed with this
 * source code.
 *
 * @package    WPSF
 * @author     Varun Sridharan <varunsridharan23@gmail.com>
 */
@import "vendor/mixins";

.wpsf-framework.wpsf-light.wpsf-theme-modern {
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.04);
  border: 1px solid #e5e5e5;

  .wpsf-header {
    background-color: #f9f9f9;
    border-bottom: 1px solid #eee;
    h1 {
      color: #333;
    }
  }

  .wpsf-footer {
    border-top: 1px solid #eee;
    background-color: #f9f9f9;
  }
  .wpsf-nav-background {
    background-color: #f9f9f9;
    border-right: 1px solid #eee;
  }

  .wpsf-nav {
    .wpsf-seperator {
      color: #888;
      border-bottom-color: #dadada;
    }

    ul {

      li .wpsf-section-active, ul li .wpsf-section-active {
        background-color: #fff;
        color: #333;
      }
      li {
        a {
          border-bottom-color: #eee;
          background-color: transparent;
          color: #555;
          &:hover {
            color: #333;
          }
        }
      }
      ul {
        border-bottom-color: #eee;
        &::before {
          background-color: #eee;
        }

        li {
          a {
            padding: 12px 12px 12px 24px;
            background-color: transparent;
            border-bottom-color: #eee;
          }
        }
      }
    }
  }

  .wpsf-body {
    &:before, &:after {
      display: table;
      content: "";
    }

    &:after {
      clear: both;
    }
  }

  .wpsf-content {
    .wpsf-section-title {

      background-color: #00a0d2;
    }
  }

  .wpsf-element {
    .wpsf-title {
      width: 35%;
    }
    .wpsf-fieldset {
      margin-left: 38%;
      .wp-editor-wrap {
        float: left;
        width: 100%;
      }

      .wp-editor-tools {
        padding-top: 0 !important;
        background-color: transparent !important;
      }
    }

    input[type="text"], input[type="number"], select, textarea {
      width: 100%;
      padding: 6px 8px;
    }

    input[type="text"], input[type="number"] {
      height: 34px;
    }

  }

  .wpsf-field-switcher {
    label em {
      background-color: #c5c5c5;
    }
    .wpsf-text-desc {
      margin: 0;
      clear: both;
    }
    label input:checked ~ em {
      background-color: #00a0d2;
    }
  }

  .wpsf-field-heading,
  .wpsf-field-subheading,
  .wpsf-element .wpsf-title h4 {
    color: #333;
    font-weight: 400;
  }

  .wpsf-field-upload {
    position: relative;
  }

  .wpsf-field-upload input[type="text"] {
    padding-right: 75px;
  }

  .wpsf-field-upload .button {
    position: absolute;
    top: 34px;
    right: 32px;
  }
}