/**
 * $JA#COPYRIGHT$
 */
 
// VARIABLES & MIXINS
// ------------------
@import "../../../less/vars.less"; // Modify this for custom colors, font-sizes, etc


// CONTAINER TABS
// ------------------
.acm-container-tabs {
  .container-tabs-nav {
    border-bottom: 1px solid @gray-lighter;

    .nav-tabs {
      border: 0;

      li {
        width: 100%;

        @media (min-width: @screen-xs) {
          margin-right: @t3-global-margin;
          width: auto;
        }

        a {
          border: 0;
          border-bottom: 1px solid @gray-lighter;
          color: @text-color;
          font-weight: @font-weight-semibold;
          outline: none;
          margin: 0;
          padding-left: 0;
          padding-right: 0;
          position: relative;

          @media (min-width: @screen-sm) {
            border: 0;
          }

          &:after {
            background: @gray-light;
            bottom: -1px;
            content: "";
            display: block;
            height: 1px;
            left: 0;
            position: absolute;
            width: 0px;
            .transition(width 0.35s);
          }

          &:hover {
            background-color: transparent;

            &:after {
              width: 100%;
            }
          }
        }
        
        &.active a {
          background: transparent;
          border-bottom: 1px solid @brand-primary;
          color: @brand-primary;
        } 
        
        // compatible j4
        a.active {
          background: transparent;
          border-bottom: 1px solid @brand-primary;
          color: @brand-primary;
        }  
      }      
    }
  }

  .tab-pane {
    display: none;
  	.section-inner {
  		padding: (@t3-global-padding * 3) 0 0;
  	}

    &.active {
      display: block;
    }
  }
}


// Import Styles Less
@import "style-2.less";