@import url('bootstrap.less');
@import url('fenix-renderes-interop.less');

@bar-padding: 8px;
@bar-color:   #ddd;

.fenixedu-bar {
  min-height: 0;
  margin-bottom: 0;
  border: none;
  background:#444;

  .navbar-text {
    margin-top: @bar-padding;
    margin-bottom: @bar-padding;
    margin-left: 20px;
    color: @bar-color;
  }
  a, li a, .navbar-brand {
    padding-top: @bar-padding;
    padding-bottom: @bar-padding;
    color: @bar-color !important;
  }
  .navbar-brand {
    height: auto;
    font-size: 14px;
  }
  .navbar-nav > .active > a {
    padding-top: 4px;
    padding-bottom: 4px;
    margin: 4px 5px 0 5px;
    background-color: #666;
  }
  .navbar-nav > .active > a:hover {
    background-color: #3a3a3a;
  }
  .devmode{
    font-size:11px;
  }
}

* {
    text-rendering: optimizelegibility;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.004);
    margin: 0;
}

input {
   outline: none;
}

header {
    background: transparent;
    border-bottom: 1px solid @body-bg;
    position: relative;
    margin-top: 20px;

    & > * {
        padding-left: 0!important;
        vertical-align: middle;
    }

    .nav {
        li {
            +li {
                margin-left: 0;
                }

            & > a {
                background: @gray-lighter;
                color: #222;
                border-radius: 1px;
                border: 1px solid @body-bg;
                padding: 8px 13px;
            }
            & > a:hover {
                background: @brand-primary;
                color: @body-bg;
            }
            @media (max-width: @screen-xs-max) {
                // Emulate nav-stacked
                float: none;
                & > a {
                  padding: 6px 20px;
                }
            }
        }
    }
}

#topNav {
  padding-right: 0;
  @media (min-width: @screen-sm-min) {
    display: block;
  }
}

header .nav li.active a, header .nav li.active a:hover {
    background: @gray-light;
    color: @body-bg;
}
nav#context, main {
    padding-top: 20px;
}
nav#context {
    ul {
        list-style-type: none;
        ~ ul {
                .navheader {
                    margin-top: 20px;
                }
            }
    }
    .nav {
        li.navheader {
            border-bottom: 1px solid @gray-light;
            padding-bottom: 7.5px;
            margin-left: 7.5px;
            margin-right: 7.5px;
            color: #222;
            font-size: 14px;
            strong {
              color: @gray;
            }
        }
        ul {
            li.navheader {
                border-bottom: none;
                margin-top: 15px;
            }
            li {
                a {
                    color: @gray;
                    padding-left: 20px;
                }
                a:before {
                    content: '';
                    background: url('../img/arrow_list.png') no-repeat 0 0;
                    display: block;
                    width: 5px;
                    height: 10px;
                    position: absolute;
                    margin: 3px -12px;
                }
                a:hover {
                    color: @gray-darker;
                }
            }
        }
        li {
            & > a {
                padding: 6px 0 6px 7.5px;
                color: @gray-darker;
                border-radius: 0;
                display: block;

                @media (max-width: @screen-xs-max) {
                  padding: 4px 0 4px 7.5px;
                }
            }
        }
    }
    @media (min-width: @screen-sm-min) {
      display: block;
    }
}

.navheader strong {
  font-weight: 400 !important;
}

nav#context .nav li &>a:hover, nav#context .nav li &>a:active {
    background: @gray-lighter;
    text-decoration: none;
}
main {
  @media (min-width: @screen-sm-min) {
    min-height: 700px !important;
  }
  padding-bottom: 25px;
  background-color: @gray-lighter;
  & > .breadcrumb {
      padding: 0 15px 8px 0;
      margin-bottom:10px;
      a:not(.active) {
          color: @brand-primary;
          cursor: pointer;
      }
  }
}
main &>.breadcrumb a:hover, footer a:hover {
    text-decoration: none;
    border-bottom: 1px dotted;
}
.locale-changer {
    font-size: @font-size-small;
    font-weight: 400;
    text-transform: uppercase;
}
.locale-changer.active, .locale-changer.active:hover {
    color: @gray-darker;
    border-bottom: none;
}
.locale-changer:not(:last-of-type):after {
    content: '/';
    font: normal 300 13px/1.2 "Helvetica Neue", sans-serif;
    padding: 0 4px 0 7.5px;
    color: @gray-light;
}

.hamburger {
  margin-top: 0;
  .icon-bar {
    background-color: @gray-light;
  }
  border: 1px solid @navbar-default-toggle-border-color;
}

footer {
    font: normal 400 @font-size-small/1.2 "Helvetica Neue", sans-serif;
    color: @gray-light;
    clear: both;
    padding: 40px 20px 40px 0;
    & > p {
        span:after {
          content: '|';
          padding-left: 15px;
        }
    }
    img {width: 150px; max-width: 100%}
    a {
        color: @gray-light;
        clear: both;
        margin-left: 15px;
        &:hover {
        color: @brand-primary;
        }
    }
    .brand { margin-left: 0;}
    @media (max-width: @screen-xs-max) {
      padding: 25px 20px 10px 0;
      text-align: center;
      img {
        padding-bottom: 10px;
      }
    }
}


// Navbar =====================================================================
 

 
// Buttons ====================================================================
 
.btn {
  padding: 6px 12px;
  text-transform: capitalize;
 
  &-lg {
    padding: 16px 32px;
  }
 
  &-sm {
    padding: 6px 12px;
  }
 
  &-xs {
    padding: 4px 8px;
  }
}
 
.btn-group {
 
  .btn ~ .dropdown-toggle {
    padding-left: 16px;
    padding-right: 16px;
  }
 
  .dropdown-menu {
    border-top-width: 0;
  }
 
  &.dropup .dropdown-menu {
    border-top-width: 1px;
    border-bottom-width: 0;
    margin-bottom: 0;
  }
 
  .dropdown-toggle {
 
    &.btn-default ~ .dropdown-menu {
      background-color: @btn-default-bg;
      border-color: @btn-default-border;
 
      > li > a {
        color: @btn-default-color;
      }
 
      > li > a:hover {
        background-color: darken(@btn-default-bg, 8%);
      }
    }
 
    &.btn-primary ~ .dropdown-menu {
      background-color: @btn-primary-bg;
      border-color: @btn-primary-border;
 
      > li > a {
        color: @btn-primary-color;
      }
 
      > li > a:hover {
        background-color: darken(@btn-primary-bg, 8%);
      }
    }
 
    &.btn-success ~ .dropdown-menu {
      background-color: @btn-success-bg;
      border-color: @btn-success-border;
 
      > li > a {
        color: @btn-success-color;
      }
 
      > li > a:hover {
        background-color: darken(@btn-success-bg, 8%);
      }
    }
 
    &.btn-info ~ .dropdown-menu {
      background-color: @btn-info-bg;
      border-color: @btn-info-border;
 
      > li > a {
        color: @btn-info-color;
      }
 
      > li > a:hover {
        background-color: darken(@btn-info-bg, 8%);
      }
    }
 
    &.btn-warning ~ .dropdown-menu {
      background-color: @btn-warning-bg;
      border-color: @btn-warning-border;
 
      > li > a {
        color: @btn-warning-color;
      }
 
      > li > a:hover {
        background-color: darken(@btn-warning-bg, 8%);
      }
    }
 
    &.btn-danger ~ .dropdown-menu {
      background-color: @btn-danger-bg;
      border-color: @btn-danger-border;
 
      > li > a {
        color: @btn-danger-color;
      }
 
      > li > a:hover {
        background-color: darken(@btn-danger-bg, 8%);
      }
    }
  }
}
 
// Typography =================================================================
 
.lead {
  color: @gray;
}
 
cite {
  font-style: italic;
}
 
blockquote {
  border-left-width: 1px;
  color: @gray;
 
  &.pull-right {
    border-right-width: 1px;
  }
 
  small {
    font-size: @font-size-small;
    font-weight: 300;
  }
}
 
// Tables =====================================================================
 
table {
  font-size: @font-size-small;
}
 
// Forms ======================================================================
 
input,
.form-control {
  padding: 4px;
}
 
label,
.control-label,
.help-block,
.checkbox,
.radio {
  font-size: @font-size-small;
  font-weight: normal;
}
 
.input-group-addon {
  padding: 8px 14px;
  font-size: @font-size-small;
}
 
// Navs =======================================================================
 

 
.breadcrumb {
  font-size: @font-size-base;
  font-weight: 401;
  background-color: transparent;
}
 
.pagination {
  font-size: @font-size-small;
  font-weight: 300;
  color: @gray-light;
 
  > li {
    > a,
    > span {
      margin-left: 4px;
      color: @gray-light;
    }
  }
 
  > .active {
    > a,
    > span {
      color: #fff;
    }
  }
 
  > li,
  > li:first-child,
  > li:last-child {
    > a,
    > span {
      border-radius: 3px;
    }
  }
 
  &-lg > li > a {
    padding-left: 22px;
    padding-right: 22px;
  }
 
  &-sm > li > a {
    padding: 0 5px;
  }
}
 
.pager {
  font-size: @font-size-small;
  font-weight: 300;
  color: @gray-light;
}
 
.list-group {
  font-size: @font-size-small;
  font-weight: 300;
}
 
// Indicators =================================================================
 
.close {
  opacity: 0.4;
 
  &:hover,
  &:focus {
    opacity: 1;
  }
}
 
.alert {
  font-size: @font-size-small;
  font-weight: 300;
 
  a,
  .alert-link {
    font-weight: normal;
    color: #fff;
    text-decoration: underline;
  }
 
  .close {
    color: #fff;
    text-decoration: none;
 
    &:hover,
    &:focus {
      color: #fff;
    }
  }
}
 
.label {
  padding-left: 1em;
  padding-right: 1em;
  border-radius: 0;
  font-weight: 300;
 
  &-default {
    background-color: @btn-default-bg;
    color: @btn-default-color;
  }
}
 
.badge {
  font-weight: 300;
}
 
// Progress bars ==============================================================
 
.progress {
  height: 25px;
  padding: 2px;
  background-color: @body-bg;
  border: 1px solid #ccc;
  .box-shadow(none);
}
 
// Containers =================================================================
 
.popover {
  color: #fff;
  font-size: 12px;
  font-weight: 300;
}
 
.panel {
  &-heading,
  &-footer {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
  }
}

.logo-container{
  padding-right: 0;
  @media (max-width: @screen-xs-max) {
    text-align: left;
    margin-left: 10px;
    padding-bottom: 15px;
  }
  img { max-width: 95%; }
}
 input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea {
  font-family: "Helvetica Neue",Arial,Helvetica,sans-serif;
  padding: 4px 6px;
  border: 1px solid #c6c6c6;
  resize: none;
  background: #fff;
  vertical-align: middle;
&:focus{
    border-color: rgba(153,153,153,.9);
  -webkit-box-shadow: rgba(0,0,0,.2) 0 1px 1px inset;
  -moz-box-shadow: rgba(0,0,0,.2) 0 1px 1px inset;
  box-shadow: rgba(0,0,0,.2) 0 1px 1px inset;
  outline: 0 none;

}
}

.btn{
  outline: none;
}

@media print {
    nav, header, footer, ol.breadcrumb, .fenixEduBar {
      display: none !important;
    }
    main {
      left: 0px !important;
      width: 100% !important;
    }
    a[href]:after {
      content: none !important;
    }
    body {
      min-width: 1000px !important;
    }
}

footer a.brand:hover{
	text-decoration:none;
	border-bottom:none;
}