/** 
 *------------------------------------------------------------------------------
 * @package       T3 Framework for Joomla!
 *------------------------------------------------------------------------------
 * @copyright     Copyright (C) 2004-2013 JoomlArt.com. All Rights Reserved.
 * @license       GNU General Public License version 2 or later; see LICENSE.txt
 * @authors       JoomlArt, JoomlaBamboo, (contribute to this project at github 
 *                & Google group to become co-author)
 * @Google group: https://groups.google.com/forum/#!forum/t3fw
 * @Link:         http://t3-framework.org 
 *------------------------------------------------------------------------------
 */
 

// --------------------------------------------------
// BOOTSTRAP COMPONENTS STYLES
// --------------------------------------------------

//
// TITLES
// --------------------------------------------------


// Page Subheader
// --------------
.page-subheader {
  border-bottom: 1px solid @t3-border-color;
  margin: 0 0 @line-height-computed;
  .clearfix();
}

.page-subtitle,
.page-subheader h2 {
  line-height: 1;
  margin: 0;
}

.page-header + .page-subheader {
  margin-top: -@line-height-computed; //If there is page header, then omit the space before page subheader
}


// Article Header
// --------------
.article-header {
}

.article-title,
.article-header h1 {
  margin: 0 0 @line-height-computed 0;
}

// Smaller "Article Title" in Blog and List layout
h2.article-title,
.article-header h2 {
}


// Item Header
// -----------


//
// MASHEAD & JUMBOTRON
// --------------------------------------------------

// Jumbotron (jumbotron.less)
// --------------------------
.jumbotron {

  h1, h2, h3 {
    margin-top: 0;
  }

  p {
    // Remove margin on last paragraph
    &:last-child {
      margin-bottom: 0;
    }
  }

  .container & {
    border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container
  }

  @media screen and (min-width: @grid-float-breakpoint) {
    .container & {
    }
    h1 {
    }
  }

}

// Mashead
// --------
.masthead {
  padding: (@t3-global-padding * 2) 0;
  text-align: center;

  p {
    // Remove margin on last paragraph
    &:last-child {
      margin-bottom: 0;
    }
  }

  @media screen and (min-width: @grid-float-breakpoint) {
    padding: (@t3-global-padding * 4) 0;

    h1 {
      font-size: @font-size-base * 7;
    }

    p {
      font-size: @font-size-base * 2;
    }

    // Bigger mashead btn
    .btn-lg {
      margin-top: @line-height-computed;
      padding: 18px 42px;
      font-size: @font-size-base * 1.5;
    }
  }

}


// T3 Jumbotron Primary
// --------------------
.jumbotron-primary {
  background-color: @brand-primary;
  color: lighten(@brand-primary, 50%);
  h1, h2, h3 {
    color: @white;
  }
  p {
    color: @white;
  }
  .btn-primary {
    border-color: #fff;
  }
}



//
// LABELS & BADGES
// --------------------------------------------------

// Labels (labels.less)
// --------------------

.label {

  // Add hover effects, but only for links
  &[href] {
    &:hover,
    &:focus {
    }
  }

  // Empty labels collapse automatically (not available in IE8)
  &:empty {
    display: none;
  }
}

// Colors
// Contextual variations (linked labels get darker on :hover)

.label-default {
}

.label-primary {
}

.label-success {
}

.label-info {
}

.label-warning {
}

.label-danger {
}


// Badges (badges.less)
// --------------------

// Base classes
.badge {

  // Empty badges collapse automatically (not available in IE8)
  &:empty {
    display: none;
  }
}

// Hover state, but only for links
a.badge {
  &:hover,
  &:focus {
  }
}

// Quick fix for labels/badges in buttons
.btn .badge {
  position: relative;
  top: -1px;
}

// Quick fix for labels/badges in page-header- NNTH
.page-header {
  .label, .badge {
    vertical-align: middle;
  }
}



//
// THUMBNAILS  (thumbnails.less)
// --------------------------------------------------

// Mixin and adjust the regular image class
.thumbnail {
  > img {
  }
}

// Add a hover state for linked versions only
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
}

// Image captions
.thumbnail .caption {
}



//
// ALERTS (alerts.less)
// --------------------------------------------------

// Base styles
// -------------------------
.alert {

  // Headings for larger alerts
  h4 {
    color: inherit;
  }

  // Provide class for links that match alerts
  .alert-link {
  }

}

.alert {
  padding: 28px 128px 28px;
  min-height: 60px;
  margin-bottom: @line-height-base;
  background-color: @alert-warning-bg;
  position: relative;
  color: @alert-warning-text;
  h4 {
    color: @alert-warning-text;
  }
  &:before {
    position: absolute;
    font-family: FontAwesome;
    left: 26px;
    top: 50%;
    line-height: 0;
    content: '\f071';
    font-size: 79px;
    color: @warning-icon-color;
  }
}

// Adjust close link position
.alert .close {
  position: absolute;
  top: 12px;
  right: 20px;
  line-height: @line-height-base;
}

// Dismissable alerts
// ------------------
.alert-dismissable {
}


// Alternate styles
// ---------------
.alert-success {
}

.alert-info {
}

.alert-warning {
}

.alert-danger {
}



//
// MEDIA OBJECTS (media.less)
// Source: http://stubbornella.org/content/?p=497
// --------------------------------------------------

// Common styles
// -------------------------
.media,
.media .media {
}

.media:first-child {
  margin-top: 0;
}

.media-object {
  display: block;
}

.media-heading {
  margin: 0 0 5px;
}


// Media image alignment
// -------------------------
.media {
  > .pull-left {
    margin-right: 10px;
  }
  > .pull-right {
    margin-left: 10px;
  }
}


// Media list variation
// -------------------------
.media-list {
}



//
// LIST GROUP (list-groups.less)
// --------------------------------------------------
// Base class
//
// Easily usable on <ul>, <ol>, or <div>.
.list-group {
  // No need to set list-style: none; since .list-group-item is block level
}


// Individual list items
// -------------------------
.list-group-item {

  // first and last items
  &:first-child {
  }
  &:last-child {
  }

  // Align badges within list items
  > .badge {
    float: right;
  }
  > .badge + .badge {
    margin-right: 5px;
  }
}

// Linked list items
a.list-group-item {

  .list-group-item-heading {
  }

  // Hover state
  &:hover,
  &:focus {
  }

  // Active class on item itself, not parent
  &.active,
  &.active:hover,
  &.active:focus {

    // Force color to inherit for custom content
    .list-group-item-heading {
      color: inherit;
    }
    .list-group-item-text {
      color: lighten(@list-group-active-bg, 40%);
    }
  }
}

// Custom content options
// -------------------------
.list-group-item-heading {
}

.list-group-item-text {
}



//
// PANELS (panels.less)
// --------------------------------------------------
// Base class
.panel {
}

// Panel contents
.panel-body {
}


// Optional heading
.panel-heading {
  > .dropdown .dropdown-toggle {
    color: inherit;
  }
}

// Within heading, strip any `h*` tag of it's default margins for spacing.
.panel-title {
  > a {
    color: inherit;
  }
}

// Optional footer (stays gray in every modifier class)
.panel-footer {
}


// Collapsable panels (aka, accordion)
.panel-group {

  .panel {
    + .panel {
    }
  }

  .panel-heading {
    + .panel-collapse .panel-body {
    }
  }

  .panel-footer {
    + .panel-collapse .panel-body {
    }
  }

}


// Contextual variations
.panel-default {
}

.panel-primary {
}

.panel-success {
}

.panel-warning {
}

.panel-danger {
}

.panel-info {
}



//
// WELLS (wells.less)
// --------------------------------------------------
// Base class
.well {
  blockquote {
  }
}

// Sizes
.well-lg {
}

.well-sm {
}



//
// MODALS (modals.less)
// --------------------------------------------------
// Container that the modal scrolls within
.modal {
}

// Shell div to position the modal with bottom padding
.modal-dialog {
}

// Actual modal
.modal-content {
}

// Modal background
.modal-backdrop {
  // Fade for backdrop
  &.fade { .opacity(0); }
  &.in { .opacity(.5); }
}

// Modal header
// Top section of the modal w/ title and dismiss
.modal-header {
}
// Close icon
.modal-header .close {
}

// Title text within header
.modal-title {
}

// Modal body
// Where all modal content resides (sibling of .modal-header and .modal-footer)
.modal-body {
}

// Footer (for actions)
.modal-footer {
}

// Scale up the modal
@media screen and (min-width: @screen-sm-min) {
  .modal-dialog {
    width: 600px;
    margin: 30px auto;
  }
  .modal-content {
    .box-shadow(0 5px 15px rgba(0,0,0,.5));
  }
}



//
// TOOLTIPS (tooltips.less)
// --------------------------------------------------

// Base class
.tooltip {
}

// Wrapper for the tooltip content
.tooltip-inner {
}

// Arrows
.tooltip-arrow {
}
